CSS-Fluss-Layout
Normaler Fluss, oder Fluss-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 Gruppe von Dingen, die alle zusammenarbeiten und voneinander innerhalb Ihres Layouts wissen. Sobald ein Element aus dem Fluss entfernt wird, arbeitet es unabhängig.
Im normalen Fluss werden inline-Elemente in der Inline-Richtung angezeigt, das heißt in der Richtung, in der Wörter in einem Satz entsprechend dem Writing Mode des Dokuments angezeigt werden. block-Elemente werden eines nach dem anderen angezeigt, so wie Absätze im Writing Mode dieses Dokuments. Im Englischen werden Inline-Elemente also eines nach dem anderen angezeigt, beginnend von links, und Block-Elemente beginnen oben und bewegen sich die Seite hinunter.
Einfaches Beispiel
Das folgende Beispiel zeigt Block- und Inline-Level-Boxen. Die beiden Absatz-Elemente mit grünem Rahmen sind 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 der entsprechenden Stelle im Satz angezeigt.