CSS-Bedingungsregeln

Das CSS conditional rules Modul definiert CSS-Medien- und Support-Abfragen, die es Ihnen ermöglichen, Styles zu definieren, die nur angewendet werden, wenn bestimmte Bedingungen erfüllt sind. Die in diesem Modul definierten Bedingungsregeln basieren auf dem Gerät, dem User-Agent und den Viewport-Fähigkeiten. Mit Bedingungsregeln können Sie CSS-Styles basierend auf Abfragewerten oder Browser- und Gerätefunktionen gezielt anwenden, unabhängig vom gerenderten Dokument.

Die ersten CSS-Bedingungsregeln waren Medientypen, die das beabsichtigte Zielmedium für die verlinkten Styles wie screen oder print spezifizierten. Diese wurden als Wert der media Attribute der HTML-Elemente <link> und <style> gesetzt oder als kommagetrennte Liste von Medientypen innerhalb einer @import Anweisung oder eines At-Rules. Die Fähigkeit, CSS-Regeln bedingt anzuwenden, wurde seit den Implementierungen von CSS 2.1 und HTML 4.01, die bedingte Abfragen auf wenige Medientypen beschränkten, erheblich erweitert.

CSS-Bedingungsregeln umfassen jetzt auch Feature-Abfragen; das @supports At-Rule ermöglicht das gezielte Anwenden von CSS-Styles basierend auf den CSS-Fähigkeiten eines User-Agent. Zusätzliche Bedingungen umfassen, welche Selektoren, Schriftformate und -technologien unterstützt werden.

Das CSS-Bedingungsregeln-Modul erweitert auch @media, um das Verschachteln von At-Rules zu ermöglichen. Das verwandte CSS Media Queries Modul entfernt ungenutzte Medientypen und fügt viele Medienmerkmale und Bedingungen hinzu, die gezielt angesprochen werden können.

Das CSS-Containerabfragen-Modul definiert ähnliche Bedingungsregeln, die jedoch auf dem Elternteil eines Elements und nicht auf dem Viewport basieren.

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