CSS bedingte Regeln

Das CSS conditional rules-Modul definiert CSS-Medien- und Support-Abfragen, mit denen Sie Stile definieren können, die nur angewendet werden, wenn bestimmte Bedingungen erfüllt sind. Die in diesem Modul definierten bedingten Regeln basieren auf den Fähigkeiten von Gerät, User-Agent und Viewport. Mit bedingten Regeln können Sie CSS-Stile basierend auf Abfragewerten oder Browser- und Gerätefunktionen anwenden, unabhängig von dem Dokument, das gerendert wird.

Die ersten CSS-bedingten Regeln waren Medientypen, die das beabsichtigte Zielmedium für die verknüpften Stile angaben, zum Beispiel screen oder print. Diese wurden als Wert der media-Attribute der HTML-<link>- und <style>-Elemente festgelegt oder als durch Kommas getrennte Liste von Medientypen innerhalb eines @import-Statements oder einer At-Regel. Die Möglichkeit, CSS-Regeln bedingt anzuwenden, wurde seit der Implementierung von CSS 2.1 und HTML 4.01, die bedingte Abfragen auf wenige Medientypen beschränkten, stark erweitert.

CSS-bedingte Regeln umfassen jetzt Funktionsabfragen; die @supports-At-Regel ermöglicht es, CSS-Stile basierend auf den CSS-Fähigkeiten eines User-Agents anzuwenden. Zusätzliche Bedingungen umfassen, welche Selektoren, Schriftformate und Schrifttechnologien unterstützt werden.

Das CSS-bedingte Regeln-Modul erweitert auch @media, um das Verschachteln von At-Regeln zu ermöglichen, wobei das verwandte CSS-Medienabfragen-Modul unbenutzte Medientypen entfernt und viele Medienmerkmale und -bedingungen hinzufügt, die gezielt werden können.

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

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