Fluss

Der Fluss einer Webseite bestimmt die Reihenfolge, in der Elemente vertikal und horizontal angezeigt werden. Standardmäßig werden Elemente in der Reihenfolge angezeigt, in der sie im HTML-Dokument erscheinen, von oben nach unten. Der horizontale Fluss bewegt sich typischerweise von links nach rechts; jedoch wird der Fluss in Sprachen, die von rechts nach links gelesen werden, auch von rechts nach links umgekehrt.

Jedes Element in HTML ist ein rechteckiger Bereich, der eine Position auf einer Linie einnimmt, ähnlich wie Wörter auf einem linierten Blatt. Es gibt zwei Haupttypen von Elementen: Block-Level- und Inline-Elemente.

Nach der Untersuchung des Beispiels ergibt sich folgende Schlussfolgerung:

Block-Level-Element: nimmt die gesamte Breite seines Containers ein, unabhängig von der Größe des Inhalts. Blockelemente stapeln sich übereinander, eines nach dem anderen.

Inline-Element: nimmt nur so viel Breite ein, wie sein Inhalt benötigt. Dies ermöglicht es Inline-Elementen, auf derselben Zeile zu sitzen. Sie werden zur nächsten Zeile umgebrochen, wenn nicht genug Platz in einer Zeile vorhanden ist.

Hinweis

Die Display-Eigenschaft von HTML-Elementen ist gemäß den Standards und Konventionen der HTML-Spezifikation vordefiniert. Diese Standards bestimmen das Standardanzeigeverhalten von Elementen in verschiedenen Webbrowsern. Sie können den spezifischen Typ eines Elements in den bereitgestellten Referenz- oder Spezifikationslinks finden: HTML-Referenz und HTML-Spezifikation.

Elementtypen

Wie bereits erwähnt, hat jedes Element im Browser-Stylesheet einen Typ, der durch die display-Eigenschaft dargestellt wird und sein Verhalten bestimmt. Die beiden Haupttypen von Elementen sind Block-Level und Inline-Elemente, und es gibt auch zusätzliche Typen wie Inline-Block-Elemente.

Inline-Elemente: hauptsächlich verwendet für das Styling und Hervorheben kleiner Teile von Inhalten, wie Links, Buttons und Bilder. Sie bleiben in derselben Zeile, bis der Platz gefüllt ist, und wechseln dann zur nächsten Zeile.

Block-Elemente: verwendet, um größere Inhaltsstrukturen wie Überschriften, Absätze, Listen und Abschnitte (z. B. Header, Footer) zu definieren. Sie werden visuell als rechteckige Blöcke angezeigt, die vertikal übereinander gestapelt werden.