CSS: supports() statische Methode
Baseline
Weitgehend verfügbar
Diese Funktion ist gut etabliert und funktioniert auf vielen Geräten und in vielen Browserversionen. Sie ist seit September 2015 browserübergreifend verfügbar.
Die statische Methode CSS.supports() gibt einen booleschen Wert zurück, der angibt, ob der Browser ein bestimmtes CSS-Feature unterstützt oder nicht.
Syntax
CSS.supports(propertyName, value)
CSS.supports(supportCondition)
Parameter
Es gibt zwei unterschiedliche Sets von Parametern. Das erste ermöglicht es, die Unterstützung eines Property-Value-Paares zu testen:
propertyName-
Ein Zeichenfolge, die den Namen der zu überprüfenden CSS-Eigenschaft enthält.
value-
Ein Zeichenfolge, die den Wert der zu überprüfenden CSS-Eigenschaft enthält.
Die zweite Syntax nimmt einen Parameter an, der der Bedingung von @supports entspricht:
supportCondition-
Ein Zeichenfolge, die die zu überprüfende Bedingung enthält.
Rückgabewert
true, wenn der Browser die Regel unterstützt, andernfalls false.
Beispiele
In den folgenden Beispielen ist result ein boolescher Wert, der anzeigt, ob der Browser das angegebene CSS-Feature unterstützt.
result = CSS.supports("text-decoration-style", "blink");
result = CSS.supports("display: flex");
result = CSS.supports("(--foo: red)");
result = CSS.supports("selector(:has(a))");
result = CSS.supports(
"(transform-style: preserve) or (-moz-transform-style: preserve) or (-webkit-transform-style: preserve)",
);
Für weitere Beispiele und Syntaxfunktionen siehe die @supports-Regel.
Spezifikationen
| Spezifikation |
|---|
| CSS Conditional Rules Module Level 3 # dom-css-supports |
Browser-Kompatibilität
Siehe auch
- Die
@supports-Regel, die dieselbe Funktionalität auf deklarative Weise ermöglicht. - Die
CSSSupportsRuleCSSOM-Klasse, die Ihnen erlaubt,@supports-Regeln zu manipulieren.