CSS @supports Regel

David Walsh berichtet heute über weiter reichende Unterstützung diverser Browser der @supports – Regel, auch das W3C hat Ende März sein Dokument zu den Conditional Rules aktualisiert.

Wer es noch nicht schon gelesen hat, die @supports-Regel dient zum Abfragen, Testen und Filtern per CSS oder JavaScript, ob bestimmte CSS-Eigenschaften auf dem jeweiligen Browser verfügbar sind, oder eben nicht.

Grundsätzliche Funktionsweise hierbei:

<style>
@supports (Eigenschaft:Wert) {
Element {
/* Elementeigenschaften */
}
}
</style>

Zu deutsch: Wenn der Browser die Darstellung dieser Eigenschaft mit diesem Wert unterstützt, dann (und nur dann) wende die folgenden Style-Deklarationen für ein Element xy an. (diese folgenden Eigenschaften müssen aber nicht zwangsläufig zu der wenn-Frage gehören!)

Hierzu gibt es auch eine Verneinung, also eine Negation:

<style>
@supports not (Eigenschaft:Wert) {
Element {
/* Elementeigenschaften */
}
}
</style>

Weiterlesen

  • Veröffentlicht in: CSS3