CSS-Positionierungs-Layout
Das Modul CSS-Positionierungs-Layout definiert die auf Koordinaten basierenden Positionierungs- und Offset-Schemata in CSS und die Eigenschaften, die verwendet werden, um Elemente auf einer Webseite zu positionieren und zu stapeln. Das Modul ist vor allem dafür bekannt, die grundlegenden Positionierungsmethoden zu definieren, einschließlich relativer Positionierung, Sticky-Positionierung, absoluter Positionierung und fester Positionierung. Es legt außerdem fest, wie positionierte Elemente gezeichnet und geschichtet werden, und klärt das Stapelverhalten und die visuelle Reihenfolge.
Das Positionierungsmodul definiert die physischen, logischen und Kurzform Einfügeigenschaften. Die logischen Eigenschaften ermöglichen die Entwicklung unter Berücksichtigung von Internationalisierung und Responsivität.
Wie alle CSS-Module beeinflusst dieses Modul andere Module und wird von ihnen beeinflusst. Es beschreibt, wie die Positionierung mit anderen Layout-Modulen wie CSS-Flexible-Box-Layout und CSS-Grid-Layout interagiert. Andere Module, wie zum Beispiel CSS-Anker-Positionierung, bauen auf diesem Modul auf, um die Positionierung von Elementen relativ zu anderen Elementen und Ebenen zu ermöglichen.
Referenz
>Eigenschaften
Selektoren
Glossarbegriffe und Definitionen
Leitfäden
- Z-Index verstehen
-
Präsentiert das Konzept des Stapelkontexts und erklärt, wie die Z-Ordnung funktioniert, mit mehreren Beispielen.
- Stapeln ohne die Eigenschaft
z-index -
Die Stapelregeln, die gelten, wenn
z-indexnicht verwendet wird. - Schwebende Elemente stapeln
-
Wie schwebende Elemente mit dem Stapeln gehandhabt werden.
- Verwendung von
z-index -
Wie
z-indexverwendet wird, um die Standard-Stapelung zu ändern. - Staplerkontext
-
CSS-Staplerkontext, die CSS-Funktionen, die neue Stapelkontexte erstellen, und verschachtelte Stapelkontexte.
- Lernen: Positionierung
-
Die verschiedenen Positionierungswerte und deren Anwendung.
Verwandte Konzepte
Spezifikationen
| Specification |
|---|
| CSS Positioned Layout Module Level 3> |
| CSS Positioned Layout Module Level 4> |
Siehe auch
- Andere CSS
*-positionEigenschaften: - Positionsbezogene Datentypen
- CSS Scroll Snap-Modul