CSS-Ankerpositionierung

Das CSS-Ankerpositionierungsmodul definiert Funktionen, die es ermöglichen, Elemente miteinander zu verknüpfen. Bestimmte Elemente werden als Ankerelemente definiert; ankerpositionierte Elemente können dann ihre Größe und Position basierend auf der Größe und dem Standort der Ankerelemente, an die sie gebunden sind, festlegen.

Zusätzlich bietet die Spezifikation rein CSS-basierte Mechanismen, um:

Eine Reihe alternativer Positionen für ein verankertes Element anzugeben; wenn die Standard-Rendering-Position dazu führt, dass es seinen enthaltenden Block überfließt und/oder außerhalb des Bildschirms gerendert wird, versucht der Browser, das verankerte Element stattdessen in den alternativen Positionen zu rendern.
Bedingungen zu deklarieren, unter denen ankerpositionierte Elemente verborgen werden sollen, in Situationen, in denen es nicht angebracht ist, sie an Ankerelemente zu binden.

Referenz

Eigenschaften

Hinweis: Das CSS-Ankerpositionierungsmodul führt die Eigenschaft anchor-scope ein, die noch nicht implementiert wurde.

At-Regeln und Deskriptoren

@position-try

Funktionen

Datentypen und Werte

HTML-Attribute

anchor Nicht standardisiert

Schnittstellen

CSSPositionTryDescriptors
CSSPositionTryRule
HTMLElement.anchorElement Nicht standardisiert

Leitfäden

Verwendung der CSS-Ankerpositionierung: Ein einführender Leitfaden zu grundlegenden Konzepten der Ankerpositionierung, einschließlich Verknüpfung, Positionierung und Größenänderung von Elementen relativ zu ihrem Anker.
Fallback-Optionen und bedingtes Verbergen bei Überlauf: Ein Leitfaden zu den Mechanismen, die die CSS-Ankerpositionierung bietet, um zu verhindern, dass ankerpositionierte Elemente ihre enthaltenden Elemente oder das Ansichtsfenster überlaufen, einschließlich Fallback-Optionen für die Positionierung und bedingtes Verbergen von Elementen.

Spezifikationen

Specification
CSS Anchor Positioning