Heim > Web-Frontend > HTML-Tutorial > Verschachtelungsproblem bei HTML-Elementen

Verschachtelungsproblem bei HTML-Elementen

高洛峰
Freigeben: 2017-02-15 14:03:59
Original
2201 Leute haben es durchsucht

HTML-Elementverschachtelungsproblem

Elementverschachtelung

<p>Blockelemente können Inline-Elemente oder 某些Blockelemente enthalten, aber Inline-Elemente können keine Blockelemente enthalten, sie können nur andere Inline-Elemente enthalten.

P-Element-Verschachtelungsproblem

<p>
  <p></p>
</p>
Nach dem Login kopieren
<p> Die Verschachtelung von p und anderen Elementen auf Blockebene im P-Element wird im Browser wie folgt analysiert:

<p>HTML元素嵌套问题

<p>Sie können sehen, dass am Ende des Elements ein leeres <p></p> steht.

<p> Bei einer Untersuchung wurde festgestellt, dass p元素 nicht innerhalb von 块级元素 verpackt werden kann.
Da die von uns verwendete DTD vorschreibt, dass 块级元素 nicht in <p> platziert werden kann, und einige Browser diese Schreibweise dulden:

<p>这是一个段落的开始
<p>这是另一个段落的开始
Nach dem Login kopieren
<p> wird als <p>-Tag verwendet. Bevor es endet, wird es wird sich selbst beenden, wenn er auf das nächste Blockelement trifft. Tatsächlich verarbeitet der Browser sie wie folgt:

<p>这是一个段落的开始</p>
<p>这是另一个段落的开始</p>
Nach dem Login kopieren
<p>Dies erklärt auch, warum am Ende zu viele davon im Browser vorhanden sind >. <p></p>

Problem bei der Verschachtelung von Elementen auf Blockebene

Sie können zunächst alle Blockelemente erneut in mehrere Ebenen unterteilen. Wir wissen bereits, dass sich <p> auf der äußersten Ebene und <html> als nächstes befindet wird nur <html> im Level sein, und wir wissen bereits, dass visuelle Elemente nur in <head>、<body>、<frameset>、<noframes> erscheinen werden, also haben wir <body> in das erste Level eingefügt. Platzieren Sie dann die Elemente von <body> in der dritten Ebene und die anderen in der zweiten Ebene. Zu den sogenannten Elementen, die nicht frei verschachtelt werden können, gehören nur: 不可以自由嵌套 für Titel-Tags; <h1>、<h2>、<h3>、<h4>、<h5>、<h6>、<caption> für Absatz-Tags; existiert auf der untergeordneten Ebene des Listenelements <p>). <hr><dt><dl> bedeutet, dass Elemente auf Blockebene nur Inline-Elemente verschachteln können.

ist zufällig auch einer von ihnen. <p>三级元素Warum können Elemente der zweiten Ebene frei verschachtelt werden? p

Wir können sie uns als einige Container (oder Kisten) vorstellen und die Größe dieser Container kann beispielsweise frei geändert werden kann

in

eingebettet werden, oder <p> kann in <ul> eingebettet werden. <p><p> Es gibt mehrere Elemente in HTML, die ganz besonders sind: <li>, ihre Unterebenen müssen angegebene Elemente sein, die Unterebene von

> Unterebene von <p> muss <ul>、
    、<dl>、<table> oder <ul>、 sein; die Unterebene von <li> muss <dl> oder <dt> usw. sein, und die Unterebene muss <dd> sein (<table> existiert nur in <caption>), gefolgt von <thead>、<tfoot>、<tbody> oder <tr>, wo Inhalte platziert werden können. <tr><thead>、<tfoot>、<tbody>Inline-Elemente<td><th>Tatsächlich kann man unter den Inline-Elementen noch mehrere Elemente (

    usw.) unterscheiden, die die Breite definieren können Höhe. Obwohl im

    -Browser alle Elemente Breite und Höhe definieren können, ist dies der eigene Standard von

    und wird von nicht allen Browsern als ersetzte Elemente bezeichnet Inline-Blöcke, obwohl diese Elemente zu Inline gehören, haben sie einen bestimmten Block (Breite und Höhe können festgelegt werden). Wir können jedem Element auch das CSS-Attribut display:inline-block geben. <p>Elemente, die selbst einen Inline-Block haben, sollten dies nicht tun! <img>、<input>IEWeitere Probleme mit der Verschachtelung von HTML-Elementen und verwandte Artikel finden Sie auf der chinesischen PHP-Website! IEW3C

    <p></p>
Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage