CSS-Bedingungsregeln

Das Modul der CSS-Bedingungsregeln definiert CSS-Media- und Unterstützungsabfragen, mit denen Sie Stile definieren können, die nur angewendet werden, wenn bestimmte Bedingungen erfüllt sind. Die in diesem Modul definierten Bedingungsregeln basieren auf Geräte-, User-Agent- und Viewport-Fähigkeiten. Mit Bedingungsregeln können Sie CSS-Stile basierend auf Abfragewerten oder Browser- und Gerätefunktionen anwenden, unabhängig vom gerenderten Dokument.

Die ersten CSS-Bedingungsregeln waren Medientypen, die das angestrebte Zielmedium für die verlinkten Stylesheets spezifizierten, zum Beispiel screen oder print. Diese wurden als Wert der media-Attribute der HTML-<link> und <style>-Elemente oder als kommagetrennte Liste von Medientypen innerhalb einer @import-Anweisung oder At-Regel festgelegt. Die Möglichkeit, 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 Funktionsabfragen; die @supports-At-Regel ermöglicht das Targeting von CSS-Stilen basierend auf den CSS-Fähigkeiten eines User-Agents. Zusätzliche Bedingungen beinhalten, welche Selektoren, Schriftformate und Schrifttechnologien unterstützt werden.

Das CSS-Bedingungsregelmodul erweitert auch @media, um das Schachteln von At-Regeln zu ermöglichen, wobei das verwandte CSS-Media-Abfragen-Modul ungenutzte Medientypen entfernt und viele Medienmerkmale und Bedingungen hinzufügt, die gezielt werden können.

Das CSS-Container-Abfragen-Modul definiert ähnliche Bedingungsregeln, jedoch basierend auf dem übergeordneten Element statt dem Viewport.

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 noch nicht unterstützt.