CSS-Positionierungs-Layout
Das CSS-Positionierungs-Layout-Modul definiert die auf Koordinaten basierenden Positionierungs- und Verschiebungsschemata, die in CSS verfügbar sind, sowie die Eigenschaften, die zur Positionierung und Schichtung von Elementen auf einer Webseite verwendet werden. Das Modul ist hauptsächlich bekannt für die Definition der grundlegenden Positionierungsmethoden, einschließlich relativer Positionierung, Sticky-Positionierung, absoluter Positionierung und fester Positionierung. Es definiert auch, wie positionierte Elemente gemalt und geschichtet werden, und klärt das Stapelverhalten und die visuelle Reihenfolge.
Das Positionierungs-Layout-Modul definiert die physischen, logischen und abgekürzten Einsetz-Eigenschaften. Die logischen Eigenschaften ermöglichen die Entwicklung mit Blick auf Internationalisierung und Reaktionsfähigkeit.
Wie alle CSS-Module beeinflusst dieses Modul andere Module und wird von ihnen beeinflusst. Dieses Modul beschreibt, wie die Positionierung mit anderen Layout-Modulen wie dem CSS-Flexbox-Layout und dem CSS-Grid-Layout interagiert. Andere Module, wie z.B. die CSS-Ankerpositionierung, bauen auf diesem Modul auf, um eine Positionierung von Elementen relativ zu anderen Elementen und Ebenen zu ermöglichen.
Referenz
>Eigenschaften
Selektoren
Glossarbegriffe und Definitionen
Leitfäden
- Z-Index verstehen
-
Stellt das Konzept des Stapelkontexts vor und erklärt die Funktionsweise des Z-Ordering anhand mehrerer Beispiele.
- Stapeln ohne die
z-index-Eigenschaft -
Die Stapelregeln, die gelten, wenn
z-indexnicht verwendet wird. - Stapeln von schwebenden Elementen
-
Wie schwebende Elemente beim Stapeln behandelt werden.
- Verwendung von
z-index -
Wie man
z-indexverwendet, um das Standard-Stapeln zu ändern. - Stapelkontext
-
CSS-Stapelkontext, die CSS-Funktionen, die neue Stapelkontexte erstellen, und verschachtelte Stapelkontexte.
- Lernen: Positionierung
-
Die verschiedenen Positionswerte und deren Verwendung.
Verwandte Konzepte
Spezifikationen
| Specification |
|---|
| CSS Positioned Layout Module Level 3> |
| CSS Positioned Layout Module Level 4> |
Siehe auch
- Andere CSS
*-position-Eigenschaften: - Positionsbezogene Datentypen
- CSS Scroll Snap Modul