Inline-Inhalt
Im CSS bezeichnet man Inhalt, der am Inline-Layout teilnimmt, als Inline-Inhalt. Die meisten Textsequenzen, ersetzte Elemente und generierter Inhalt sind standardmäßig Inline-Inhalte.
Im Inline-Layout wird ein gemischter Datenstrom aus Text, ersetzten Elementen und anderen Inline-Boxen durch Fragmentierung in einen Stapel von Linienboxen angeordnet. Innerhalb jeder Linienbox sind Inline-Boxen entweder vertikal oder horizontal ausgerichtet, je nach Schreibrichtung. Typischerweise sind sie an den Baselines ihres Textes ausgerichtet. Dies kann mit CSS geändert werden.
Hinweis: HTML (HyperText Markup Language) Elemente wurden historisch entweder als "Block-Elemente" oder als "Inline-Elemente" kategorisiert. Als präsentationseigenschaft wird dies jetzt durch CSS spezifiziert.
Das Diagramm zeigt, wie Inline-Inhalt innerhalb eines Blockcontainers angeordnet ist. Die root inline box ist eine anonyme Box, die vom Blockcontainer generiert wird, um all seinen Inline-Inhalt, einschließlich Text und abgeleiteter Inline-Boxen, zu halten. Um mehr über die Konzepte in diesem Diagramm zu erfahren, wie Linienboxen, Fragmentierung von Inline-Boxen und Floats, lesen Sie den CSS Leitfaden zum Inline-Formatierungskontext.
Beispiele
<p>
This span is an <span class="highlight">inline-level element</span>; its
background has been colored to display both the beginning and end of the
element's influence. Input elements, like <input type="radio" /> and
<input type="checkbox" />, are also inline-level content.
</p>
In diesem Beispiel enthält das <p> Element etwas Text. Innerhalb dieses Textes befindet sich ein <span> Element und zwei <input> Elemente, die Inline-Elemente sind. Wenn sich das <span> über zwei Linien erstreckt, werden zwei Linienboxen generiert. Da diese Elemente inline sind, wird der Absatz korrekt als ein einzelner Absatz mit ununterbrochenem Textfluss gerendert:
Siehe auch
- Verwandte Glossarbegriffe:
- Inline-Formatierungskontext
display