Unterschied zwischen einem Block & ein Inline-Element

September 23

Unterschied zwischen einem Block & ein Inline-Element

Web-Seiten modellieren Sie ihre Inhalte in HTML-Elementen. HTML-Elemente, die grob in zwei Kategorien einteilen: Inline und Block. Welcher Kategorie ein Elementtyp ist bestimmt die Art der Struktur, die es im, sowie die Art von Strukturen enthalten sein können, die in ihm, damit eine Seite korrekt gebildet werden angezeigt werden können. Der Status eines Elements als Inline oder Blockebene wirkt sich auch, wie der Inhalt innerhalb des Web-Browsers angezeigt wird.

Elementtypen

Die verschiedenen Arten des HTML-Elements Modell verschiedene Arten von Webseiten-Inhalte. HTML-Seiten verwenden Baumstrukturen, was bedeutet, dass Elemente untergeordnete Elemente enthalten kann. In den meisten Fällen wird, die ein einzelnes Element innerhalb einer Seite zwischen die öffnenden und schließenden Tags, wie im folgenden Beispiel wird, repräsentiert die einen Absatz:

< p > hier ist einige Text in einem Absatz Element. </p >

HTML‑Elemente können Text, Medien und andere Elemente enthalten. Beim Erstellen einer Webseite-Struktur entscheiden Entwickler, welche Arten von Element für den Inhalt verwenden, die sie anzeigen möchten. Eine Webseite-Gesamtstruktur beinhaltet normalerweise mehrere Elemente in geschachtelten Strukturen, die in einigen Fällen sehr komplex sein können.

Verschachtelung

Damit für eine Webseite zuverlässig in verschiedenen Web-Browsern funktionieren muss der Inhalt darin Verschachtelung Auffangregelung für HTML entsprechen. Block-Level-Elemente können andere Block-Level-Elemente als auch Inline-Elemente enthalten. Inline-Elemente können nur enthalten, andere Inline-Elemente, sowie deren Inhalt, der d. h. in der Regel nur Text. Als Beispiel zeigt das folgende Beispiel Markup ein Elternteil "Div", das ist ein Block-Level-Element, mit einem anderen "Div" als untergeordnetes Element, das wiederum eine "Span" das ist ein Inline-Element enthält:

< Div Id = "Eltern" >

< Div Id = "Kind" >

< span > Text < / span >

< / Div >

< / Div >

Der "Div"-Elemente können mehrere andere untergeordnete Elemente enthalten. Die "Spanne" kann mehrere andere Inlineelemente enthalten, aber konnte nicht, z. B. enthalten ein weiteres "div."

CSS

Der CSS oder Cascading Style Sheet, können Erklärungen für eine Webseite angeben, ob der Browser bestimmte Elemente als Block oder Inline angezeigt werden soll. Dadurch können Entwickler zum Anpassen der Darstellung solcher Elemente unabhängig davon, ob sie natürlich Block oder Inline. Z. B. ein Absatz ist ein Block-Level-Element, aber der folgende CSS-Code legt fest, dass die Absätze mit einem bestimmten Klassenattribut Inline angezeigt werden soll:

{p.INL}

Display: Inline;

}

Web-Browser angezeigt automatisch Blockelemente Zeilenumbrüche vor und nach ihnen, mit Inline-Elemente, die natürlich in Zeile innerhalb einer anderen fallen. Angeben, dass ein Element soll, als eine oder die andere verwenden angezeigt werden erzwingt die Display-Eigenschaft in CSS diese Präsentation unabhängig vom Elementtyp.

Einschränkungen

Auch wenn CSS-Code angeben, dass ein Block-Level-Element Inline angezeigt werden soll oder ein Inline-Element als Blockebene behandelt werden soll, ändert dies nicht die Verschachtelung Beschränkungen für solche Elemente. Dies bedeutet, dass selbst wenn ein Inline-Element wie ein "Span" verfügt über eine CSS-Deklaration, die darauf hinweist, dass es als Blockebene angezeigt werden soll, es nicht auf Blockelemente innerhalb es verschachtelt noch muss oder die Seite Markup-Fehler generiert wird.