CSS-Flow-Layout
Der normale Fluss, oder Flow-Layout, ist die Art und Weise, wie Block- und Inline-Elemente auf einer Seite angezeigt werden, bevor Änderungen an ihrem Layout vorgenommen werden. Der Fluss ist im Wesentlichen eine Reihe von Dingen, die alle zusammenarbeiten und in Ihrem Layout voneinander wissen. Sobald etwas aus dem Fluss genommen wird, arbeitet es unabhängig.
Im normalen Fluss werden Inline-Elemente in der Inlinerichtung angezeigt, das heißt, in der Richtung, in der Wörter in einem Satz gemäß dem Schreibmodus des Dokuments dargestellt werden. Block-Elemente werden nacheinander angezeigt, wie es Absätze im Schreibmodus dieses Dokuments tun. Im Englischen werden Inline-Elemente daher nacheinander beginnend von links angezeigt, und Block-Elemente beginnen oben und bewegen sich die Seite hinunter.
Einfaches Beispiel
Das folgende Beispiel demonstriert Block- und Inline-Level-Boxen. Die beiden Absatz-Elemente mit einem grünen Rahmen sind auf Block-Level und werden untereinander angezeigt.
Der erste Satz enthält auch ein span
-Element mit blauem Hintergrund. Dies ist Inline-Level und wird daher an Ort und Stelle im Satz angezeigt.