Layoutgrundlagen
Abmessungs- und Positionierungseigenschaften sind über das DHTML-Dokumentobjektmodell (DOM) und als CSS-Attribute verfügbar. Sie können die DHTML DOM-Eigenschaften zum programmgesteuerten Festlegen von CSS-Eigenschaften verwenden. Über DHTML DOM verfügbar gemachte Eigenschaften geben Werte basierend darauf zurück, wie ein Element im Dokument gerendert wird. CSS-Eigenschaften geben Werte basierend auf den voreingestellten Werten anderer CSS-Eigenschaften zurück.
Das Elementfeld
Jedes sichtbare Element auf einer Webseite nimmt einen festgelegten Platz im Dokument ein. Der Platzbedarf eines Elements wird über das Elementrechteck bzw. das Inhaltsfeld festgelegt. Ein Elementrechteck wird im Strict-Modus anders behandelt als im Quirks-Modus.
Im Quirks-Modus schließen die Höhe und Breite eines Elementrechtecks die Summe aus Höhe, Breite und Innenabstand und Rahmenbreite ein. Im Strict-Modus wird das Inhaltsfeld nur anhand der Höhen- und Breiteneigenschaften definiert, ohne Innenabstand oder Rahmen.
Block- oder Inlineelemente
Alle sichtbaren HTML-Elemente werden entweder als Blöcke oder inline angezeigt. Ein Blockelement, z. B. ein DIV-Element, beginnt normalerweise eine neue Zeile und erhält seine Größe gemäß der Breite des übergeordneten Containers. Ein Inlineelement, z. B. ein SPAN-Element, beginnt normalerweise keine neue Zeile und erhält seine Größe gemäß der Höhe und Breite seines eigenen Inhalts.
Größe, Layout und Position von Elementen
Ein Element verfügt über Layout, wenn eine der folgenden Bedingungen erfüllt ist:
Es handelt sich um ein Blockebenenelement mit angegebener Höhe und Breite.
Es handelt sich um ein Blockebenenelement mit overflow-Parametern, die als nicht sichtbar festgelegt sind.
Ein positioniertes Element verfügt über bestimmte Maße und kann auf eine Position festgelegt werden, indem die Layoutattribute des Cascading Stylesheets verwendet werden: oben, rechts, links und unten. Die Position eines nicht positionierten Elements ist relativ zum nächsten übergeordneten Element, das über Layout verfügt. Die Position ist nützlich, wenn ein oder mehrere Elemente innerhalb des Dokuments zu relativen oder absoluten Koordinaten verschoben werden. Sie kann auch beim Erstellen bestimmter Dokumentformatvorlagen hilfreich sein.