Detaillierte Einführung in die Verschachtelungsregeln für HTML5-Tags

Im Folgenden erhalten Sie eine detaillierte Einführung in die Verschachtelungsregeln für HTML5-Tags. Die Zusammenfassung ist sehr gut und es lohnt sich, sie gemeinsam anzusehen.

[1] Kategorie [2] Unterelement [3] Zusammenfassung

Vorherige Wörter
In HTML5 können die Unterelemente des -Elements Blockebene sein Elemente, die zuvor als gegen die Regeln angesehen wurden. In diesem Artikel werden die Tag-Verschachtelungsregeln der HTML5-

-Klassifizierung
im Detail vorgestellt. Vor dem Aufkommen von HTML5 wurden Elemente häufig nach Block, Inline und Inline-Block unterschieden. In HTML5 werden Elemente nicht mehr nach AnzeigeAttributen, sondern nach InhaltModell unterschieden, die in Metadateninhalte (Metadateninhalte), Bereich Block, unterteilt werden Typ (Abschnittsinhalt), Überschriftentyp (Überschrifteninhalt), Dokumentflusstyp (Flussinhalt), Anweisungstyp (Formulierungsinhalt), eingebetteter Typ (eingebetteter Inhalt) und interaktiver Typ (interaktiver Inhalt). Elemente, die zu keiner Kategorie gehören, werden als durchdringend bezeichnet; Elemente, die zu mehr als einer Kategorie gehören können, werden als gemischt bezeichnet.

Metadateninhalt ist ein Element, das verwendet werden kann, um die Leistung oder das Verhalten anderer Inhalte zu beschreiben oder um eine Beziehung zwischen dem aktuellen Dokument und anderen Dokumenten herzustellen

Basislink-Meta-Noscript-Skriptstil-Vorlagentitel
Flow-Inhalt sind die meisten Elemente, die im Hauptteil von Anwendungen und Dokumenten verwendet werden

ein abgekürzter Adressbereich (wenn es sich um ein untergeordnetes Element des Kartenelements handelt) Artikel beiseite audio b bdi bdo blockquote br button canvas zitieren code daten datalist del dfn p dl em einbetten fieldset figur fußzeile form h1 h2 h3 h4 h5 h6 header hr i iframe img input ins kbd keygen label main map mark math meter nav noscript Objekt ol Ausgabe p pre Fortschritt q Ruby ​​S Samp Skript Abschnitt wählen Sie kleine Spanne stark sub sup SVG Tabellenvorlage Textbereich Zeit u ul var Video WBR Text
　Blocktyp Das Element (Abschnittsinhalt) ist wird verwendet, um den Titel- und Fußzeilenbereich zu definieren

Article Aside Nav Section
Das Überschriftenelement (Überschrifteninhalt) definiert den Titel eines Abschnitts/Abschnitts

h1 h2 h3 h4 h5 h6
　Phrasierungsinhalt ist ein Element, das zum Markieren von Text auf Absatzebene verwendet wird

a abbr-Bereich (wenn es ein untergeordnetes Element des Kartenelements ist) audio b bdi bdo br button canvas zitieren code daten datalist del dfn em einbetten i iframe img input ins kbd keygen label map mark math meter noscript object output progress q ruby ​​​​s samp script select small span strong sub sup svg template textarea time u var video wbr text
　Eingebettetes Typelement (eingebetteter Inhalt) ist ein Element das referenziert oder in andere Ressourcen im Dokument eingefügt wird

Audio Canvas Embed Iframe IMG Math Object SVG Video
Interaktive Inhalte sind speziell verwendete Elemente für die Interaktion mit dem Benutzer

a audio (wenn das Attribut „controls“ gesetzt ist) button embed iframe img (wenn das Attribut „usemap“ gesetzt ist) input (wenn das Attribut „type“ nicht ausgeblendet ist) keygen label object (wenn das Attribut „usemap“ gesetzt ist) ) select textarea video (falls das Steuerattribut ist festgelegt)

untergeordnetes Element
[1] Das untergeordnete Element ist ein Flusselement

,

, < ;blockquote> ,

,

,

,

,

,
[1.1] Untergeordnete Elemente sind Flusselemente, mit Ausnahme von

,

[1.2] Untergeordnete Elemente sind Flusselemente, enthalten jedoch keine

-Elemente

[1.6] Untergeordnete Elemente sind Flusselemente, enthalten jedoch nicht

, , Abschnittsinhalt, Überschrifteninhalt

[1.7] Das untergeordnete Element ist ein < ;figcaption>-Element, gefolgt vom Flusselement

[1.8] Das untergeordnete Element ist ein

-Element, gefolgt vom Flusselement

【2】Das Unterelement ist ein Anweisungselement

, , , , , , , , , <var>, <samp>, <kbd>, <sub>, <sup>, <i>, <b>, <u>, <mark>, <bdi>, <bdo>, , <input>, <output>, <legend>, <label><p> [2.1] Untergeordnete Elemente sind Anweisungselemente, enthalten jedoch keine Elemente, die mit sich selbst identisch sind <br> </p>&lt ;dfn>, <progress>, <meter><p> [2.2] Untergeordnete Elemente sind Anweisungselemente, enthalten jedoch keine interaktiven Inhaltselemente (interaktiver Inhalt) <br></p> <button> <p> <br></p>【3】Das untergeordnete Element ist transparent (vorbehaltlich der untergeordneten Elemente, die sein übergeordnetes Element zulässt)<p></p> <ins>, <del>, <map><p>　【3.1 】Das untergeordnete Element ist transparent (vorbehaltlich der von seinem übergeordneten Element zugelassenen untergeordneten Elemente), enthält jedoch keine interaktiven Elemente (interaktiven Inhalt) <br></p> <a><p> [3.2] Untergeordnetes Element Elemente können nein haben, es kann ein <param>-Element sein oder es kann transparent sein (vorbehaltlich der vom übergeordneten Element zugelassenen untergeordneten Elemente) <br></p> <object><p> <br></p>【4】Keine untergeordneten Elemente <p></p> <hr>, <br>, <wbr>, <img alt="Detaillierte Einführung in die Verschachtelungsregeln für HTML5-Tags" >, <embed>, <param>, <source>, , <area> , <col>, <keygen> Elemente <p><br></p> <ol>, </ol> <ul></ul></keygen></source></embed></wbr></object></a></map></del></ins></button></meter></progress></label> </legend></output></bdo></bdi></mark></u></b></i></sup></sub></kbd></samp></var>

[4.2] Untergeordnete Elemente können

sein oder <script> <template>-Elemente <p><br/> <dl>【4.3】Das untergeordnete Element muss nicht vorhanden sein, es kann <option>, <optgroup> sein oder es kann < script>, <template> element <p><br/><select> <template>-Elemente <p><optgroup><br/>　【4.5】Untergeordnete Elemente können Keines sein, es kann ein <option>-Element sein <p><datalist><br/> [4.6 ] Das untergeordnete Element kann keins sein, es kann ein <track>-Element sein, es kann auch ein <source> sein <p><audio>, <video><br/> [4.7] Dort können keine untergeordneten Elemente sein, oder sie können <col>, <template>-Elemente sein. oder es können <script>-, <template>-Elemente sein <p><tbody>, <thead>, <tfoot><br/> 【4.9】 Möglicherweise gibt es keine untergeordneten Elemente <tr>, <th>, oder sie können <script>, <template>-Elemente sein <p><tr><br/> <p>【5】Die untergeordneten Elemente sind <caption>, <colgroup>, <thead>, <tfoot>, <tbody>, oder sie können <script>, <template>-Elemente sein <br/><table> 🎜> <p><option><br/><p>Zusammenfassung Über die detaillierten Verschachtelungsregeln jedes Elements wurde der obige Teil ausführlich vorgestellt. In diesem Teil werden hauptsächlich die Verschachtelungsregeln häufig verwendeter Tags zusammengefasst <p><br/> [Hinweis] Bewegen Sie die Maus über den Text mit dunkelgrauem Hintergrund. Im Titel werden die im Element enthaltenen Tags angezeigt <p> [ 1] Die untergeordneten Elemente von <h1>, <h2>, <h3>, <h4>, <h5>, <h6>, <p> sind Anweisungselemente <p> [ 2] <header>, <footer> kann nicht verschachtelt werden<header>, <footer><br/>【3】Das untergeordnete Element von <a> ist transparent (die von seinem übergeordneten Element zugelassenen untergeordneten Elemente). sind korrekt), enthalten aber keinen interaktiven Inhalt <p><br/>【4】<form> kann nicht verschachtelt werden<form><p>【5】<button> Inhalt (interaktiver Inhalt) <br/>【6】<caption> kann nicht verschachtelt werden<table><p><p>【7】<dt>, <th> kann <Kopfzeile>, <Fußzeile>, Abschnittsinhalt, Überschrifteninhalt nicht verschachteln <p> Ich glaube, dass Sie die Methoden beherrschen, nachdem Sie diese Fälle gelesen haben. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website! <p>Verwandte Lektüre: <p><a href="http://www.php.cn/js-tutorial-381968.html" target="_blank">Implementierungsschritte für die Verwendung von JS zum Betreiben von HTTP-Cookies <br/><p><a href="http://www.php.cn/div-tutorial-381952.html" target="_blank">Schreiben Sie zuerst HTML, wenn Sie ein Web entwerfen Seite? Zuerst CSS schreiben<br/><p><a href="http://www.php.cn/css-tutorial-381941.html" target="_blank">Ein Beispiel-Tutorial für Margin-Top in der Webseitenproduktion<br/></script>

Das obige ist der detaillierte Inhalt vonDetaillierte Einführung in die Verschachtelungsregeln für HTML5-Tags. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!