Bedingte CSS-Regeln

Das Modul der bedingten CSS-Regeln definiert CSS-Medien- und Supportabfragen, die es Ihnen ermöglichen, Stile zu definieren, die nur angewendet werden, wenn bestimmte Bedingungen erfüllt sind. Die in diesem Modul definierten bedingten Regeln basieren auf Geräte-, Benutzeragent- und Viewport-Fähigkeiten. Mit bedingten Regeln können Sie CSS-Stile basierend auf Abfragewerten oder Browser- und Gerätefunktionen unabhängig vom gerenderten Dokument anpassen.

Die ersten bedingten CSS-Regeln waren Medientypen, die das vorgesehene 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 oder als kommagetrennte Liste von Medientypen innerhalb einer @import-Anweisung oder eines At-Regelsatzes gesetzt. Die Möglichkeit, CSS-Regeln bedingt anzuwenden, wurde seit den CSS 2.1- und HTML 4.01-Implementierungen, die bedingte Abfragen auf wenige Medientypen beschränkten, erheblich erweitert.

Bedingte CSS-Regeln umfassen jetzt Feature-Abfragen; die @supports-At-Regel ermöglicht das Anpassen von CSS-Stilen basierend auf den CSS-Fähigkeiten eines Benutzeragents. Zusätzliche Bedingungen umfassen unterstützte Selektoren, Schriftformatierungen und Schrifttechnologien.

Das Modul der bedingten CSS-Regeln erweitert auch @media, um das Verschachteln von At-Regeln zu ermöglichen, wobei das zugehörige CSS-Medienabfragen Modul ungenutzte Medientypen entfernt und viele Medienmerkmale und Bedingungen hinzufügt, die gezielt angesprochen werden können.

Das CSS-Containerabfragen-Modul definiert ähnliche bedingte Regeln, jedoch basierend auf dem übergeordneten Element anstatt auf dem Viewport.

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