Fluss

Der Fluss einer Webseite bestimmt die Reihenfolge, in der Elemente vertikal und horizontal angezeigt werden. Standardmäßig werden Elemente in der Reihenfolge dargestellt, in der sie im HTML-Dokument erscheinen, von oben nach unten. Der horizontale Fluss verläuft 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 Zeile einnimmt, ähnlich wie Wörter auf einem linierten Blatt. Es gibt zwei Haupttypen von Elementen: Block-Elemente und Inline-Elemente.

Nach der Analyse des Beispiels ergibt sich folgende Schlussfolgerung:

Block-Element: Nimmt die gesamte Breite seines Containers ein, unabhängig von der Größe des Inhalts. Block-Elemente werden untereinander gestapelt, eines nach dem anderen.

Inline-Element: Nimmt nur so viel Breite ein, wie der Inhalt benötigt. Dadurch können Inline-Elemente in einer Zeile nebeneinander stehen. Sie werden in die nächste Zeile umgebrochen, wenn nicht genügend Platz 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. Den spezifischen Typ eines Elements finden Sie in den Referenz- oder Spezifikationslinks: HTML Reference und HTML Specification.

Elementtypen

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

Inline-Elemente: Hauptsächlich verwendet zur Formatierung und Hervorhebung kleiner Inhaltsbereiche, wie Links, Buttons und Bilder. Sie bleiben in derselben Zeile, bis der Platz ausgefüllt ist, und umbrechen dann in die nächste Zeile.

Block-Elemente: Dienen zur Definition größerer Inhaltsstrukturen wie Überschriften, Absätze, Listen und Abschnitte (z. B. Header, Footer). Sie werden visuell als rechteckige Blöcke dargestellt, die sich vertikal übereinander stapeln.