Verschachtelte Regelanalyse der Produktion von XHTML-Tags_HTML/Xhtml_Webseiten

In der Sprache von XHTML wissen wir alle: Das ul-Tag enthält li, das dl-Tag enthält dt und dd – die Verschachtelungsregeln dieser festen Tags sind sehr klar. Es gibt jedoch immer noch viele unabhängige Tags, die nicht gebündelt sind, wie z. B. h1, div, p ... Was sind also die Verschachtelungsregeln dieser Tags? Lassen Sie uns heute über dieses Thema sprechen.

Wenn es um die Verschachtelungsregeln von XHTML-Tags geht, müssen wir zunächst wissen, dass es zwei Arten von XHTML-Tags gibt, eines heißt Block-Level-Element(Block) und das andere heißt Inline-Element (Inline, viele Leute nennen es auch: Inline, Inline, Line-Level usw.).

Der Klassifizierungsstandard für Elemente auf Blockebene und Inline-Elemente

ist sehr einfach. Bitte fügen Sie die folgenden zwei Codezeilen in das Body-Tag ein:

div1

div2

Browser-Rendering-Effekt:

div1

div2

Die beiden auf der Seite dargestellten Divs belegen zwei Reihen Platz, es sei denn, sie sind schwebend oder es werden keine anderen Einstellungen vorgenommen. Sie belegen alle dominant ihre eigene Reihe Platz Wenn Sie dieses Phänomen aufweisen, können Sie es als Block-Level-Element (Block) bezeichnen

Fügen Sie die folgenden zwei Codezeilen in das Body-Tag ein:

span1

span2

Browser-Rendering-Effekt:

span1 span2

Diesmal sind die beiden Bereiche in einer Zeile nebeneinander angeordnet. Sie sind freundlich und harmonisch... Wir können sie als Tag-Verhalten bezeichnen:

Inline-Elemente (inline) ;

Der Unterschied zwischen Elementen auf Blockebene und Inline-Elementen:

· Elemente auf Blockebene werden im Allgemeinen zum Erstellen der Website-Architektur, des Layouts und zum Übertragen von Inhalten verwendet ... Diese wichtigen physischen Aufgaben gehören alle zu Elementen auf Blockebene, die die folgenden Tags enthalten:

div, ul, li, dl, dt, dd, h1~h6, p,

Adresse……

· Inline-Elemente werden im Allgemeinen in bestimmten Details oder Teilen des Website-Inhalts verwendet, um „Stile, Hochstellungen, Tiefstellungen, Anker“ hervorzuheben, zu unterscheiden usw. Die folgenden Tags sind alle Inline-Elemente:

a, span, strong,

sub, sup, img...

· Blockelemente und Inline-Elemente können ineinander konvertiert werden . Der Konvertierungscode lautet wie folgt:

display: block; /* In Blockelement konvertieren */

display: inline; /* In Inline-Element konvertieren */

· Blockelemente und Inline-Elemente haben unterschiedliche Aufrufregeln für CSSs (in diesem Artikel geht es um die Verschachtelung von Tags, daher wird dieser Wissenspunkt nicht erläutert. ).

Nachdem wir Blockelemente und Inline-Elemente kurz verstanden haben, können wir die Verschachtelungsregeln von

XHTML-Tags unten auflisten:

1. Blockelemente können Inline-Elemente oder bestimmte Blockelemente enthalten, Inline-Elemente können jedoch keine Blockelemente enthalten :

—— Ja

—— Wahr

2. Elemente auf Blockebene können nicht in

platziert werden

—— Falsch

—— Falsch

3. Es gibt mehrere spezielle Elemente auf Blockebene, die nur Inline-Elemente und keine Elemente auf Blockebene enthalten können:

h1, h2, h3, h4, h5, h6, p, dt.

4. li kann div-Tags enthalten

– Dieses Element muss nicht separat aufgeführt werden, aber viele Leute im Internet sind darüber verwirrt, deshalb werde ich es hier kurz erklären:

Li- und div-Tags sind beide Container zum Laden von Inhalten. Sie haben den gleichen Status und unterscheiden sich nicht in Ebenen (z. B. strikte Hierarchien wie h1 und h2^_^). Sie müssen wissen, dass das li-Tag mit verbunden ist sein übergeordnetes ul oder ol kann berücksichtigt werden. Warum denken manche Leute, dass li kein div unterbringen kann? Glaube nicht, dass Li so geizig ist. Tatsächlich hat Li ein großes Herz...

5. Elemente auf Blockebene werden Elementen auf Blockebene gegenübergestellt, und Inline-Elemente werden mit Inline-Elementen gegenübergestellt:

—— Ja

—— Ja

—— Falsch