CSS-Bedingungsregeln

Das CSS-Bedingungsregeln-Modul definiert CSS-Medien- und Support-Abfragen und ermöglicht es Ihnen, Stile zu definieren, die nur angewendet werden, wenn bestimmte Bedingungen erfüllt sind. Die im Modul definierten Bedingungsregeln basieren auf den Fähigkeiten von Geräten, Benutzeragenten und Ansichtsfenstern (Viewports). Mit Bedingungsregeln können Sie CSS-Stile basierend auf Abfragewerten oder auf Browser- und Gerätefunktionen festlegen, unabhängig vom darzustellenden Dokument.

Die ersten CSS-Bedingungsregeln waren Medientypen, die das beabsichtigte Zielmedium für die verknüpften Stile spezifizierten, zum Beispiel screen oder print. Diese wurden als Wert der media-Attribute der HTML <link>- und <style>-Elemente gesetzt oder als kommagetrennte Liste von Medientypen innerhalb eines @import-Statements oder einer At-Regel. Die Möglichkeit, CSS-Regeln bedingt anzuwenden, wurde seit den Implementierungen von CSS 2.1 und HTML 4.01, die konditionale Abfragen auf wenige Medientypen beschränkten, erheblich erweitert.

CSS-Bedingungsregeln umfassen jetzt Funktionsabfragen; die @supports At-Regel ermöglicht es, CSS-Stile basierend auf den CSS-Fähigkeiten eines Benutzeragenten zu zielen. Zusätzliche Bedingungen beinhalten, welcher Selektor, welche Schriftformate und welche Schrifttechnologien unterstützt werden.

Das CSS-Bedingungsregeln-Modul erweitert auch @media, um das Verschachteln von At-Regeln zu ermöglichen, wobei das verwandte CSS-Medienabfragen Modul ungenutzte Medientypen entfernt und viele gezielte Medienmerkmale und -bedingungen hinzufügt.

Das CSS-Containerabfragen-Modul definiert ähnliche Bedingungsregeln, allerdings basierend auf dem übergeordneten Element und nicht auf dem Ansichtsfenster.

Es gibt Pläne, die möglichen Abfragen weiter zu erweitern, indem die verallgemeinerte Bedingungsregel @when und die verkettete Bedingungsregel @else hinzugefügt werden. Diese beiden At-Regeln werden derzeit nicht unterstützt.