CSS-Visuelle Formatierung (Visuelle Formatierung)

Das visuelle Formatmodell erläutert normalerweise, wie Dokumente für visuelle Medien wie Computermonitore im Dokumentbaum behandelt werden.

CSS visuelles Formatmodell

Das CSS visuelle Formatmodell ist ein Algorithmus, der zur Verarbeitung von visuellen Mediendokumenten verwendet wird. In dem visuellen Formatmodell wird jeder Element im DokumentbaumRahmenmodellErzeugt null oder mehrere Rahmen.

Die Anordnung dieser Rahmen hängt von folgenden Faktoren ab:

• Boxgröße.

• Typ des Elements (block oder inline).

• Positionierungsschemata (normaler Fluss,SchwenkenundAbsolute Positionierung）。

• Verhältnisse zwischen den Elementen in der Dokumentstruktur.

• Externe Informationen, wie z.B. die Größe des Viewports, die eingebauten Abmessungen von Bildern usw.

Art der durch CSS generierten Rahmen

Jedes Element, das auf der Webseite angezeigt wird, erzeugt einen Rechteckrahmen. Nachfolgend werden die Arten der möglichen Rahmen beschrieben.

Blockartige Elemente und Block-Boxen

Blockartige Elemente sind solche Elemente, die visuell als Blöcke formatiert werden (d.h. sie belegen die gesamte verfügbare Breite) und vor und nach dem Element Umbrüche haben. Zum Beispiel, Absatz-<p>），Überschrift (<h1> - <h6>），Trennung (<div>）im Bereich.

Im Allgemeinen können blockartige Elemente inline-elemente und andere blockartige Elemente enthalten.

Inline-elemente und Inline-Boxen

Inline-elemente sind solche Elemente im Quelltext, die keine neuen Inhaltsblöcke bilden; der Inhalt wird zeilenweise verteilt. Zum Beispiel, Absatz-<em>）Überspannung (<span>）starkes Element (<strong>）im Bereich der betonten Texte.

Inline-elemente können in der Regel nur Text und andere inline-elemente enthalten.

Sie können mit dem CSS display Attribut die Anzeigeart von Elementen auf der Webseite ändern. Sie werdenIm nächsten KapitelErfahren Sie mehr über das display Attribut.