The CSS.supports()
method returns a Boolean
value indicating if the browser supports a given CSS feature, or not.
Syntax
CSS.supports(propertyName, value); CSS.supports(supportCondition);
Parameters
There are two distinct sets of parameters. The first one allows to test the support of a pair property-value:
propertyName
- A
DOMString
containing the name of the CSS property to check. value
- A
DOMString
containing the value of the CSS property to check.
The second syntax takes one parameter matching the condition of @supports
:
supportCondition
- A
DOMString
containing the condition to check.
Return value
true
if the browser supports the rule, otherwise false
.
Examples
result = CSS.supports("text-decoration-style", "blink");
result = CSS.supports("display: flex");
result = CSS.supports("(--foo: red)");
result = CSS.supports(`(transform-style: preserve) or (-moz-transform-style: preserve) or
(-o-transform-style: preserve) or (-webkit-transform-style: preserve)`);
// result is true or false
Specification
Specification | Status | Comment |
---|---|---|
CSS Conditional Rules Module Level 3The definition of 'CSS: supports()' in that specification. | Candidate Recommendation | Initial definition. |
Browser compatibility
The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.
Update compatibility data on GitHub
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
supports
|
Chrome Full support 61 Full support 61 Partial support 28 Notes' Version 60 or older didn't support parentheses-less one-argument version. |
Edge Partial support 12 Partial support 12 Notes' Edge doesn't support parentheses-less one-argument version. |
Firefox Full support 55 Full support 55 Partial support 22 Notes' Version 54 or older didn't support parentheses-less one-argument version. Partial support 20 Disabled' From version 20: this feature is behind the |
IE
No support No |
Opera
Full support 12.1 |
Safari
Full support 10 |
WebView Android Full support 61 Full support 61 Partial support 37 Notes' Version 60 or older didn't support parentheses-less one-argument version. |
Chrome Android Full support 61 Full support 61 Partial support 28 Notes' Version 60 or older didn't support parentheses-less one-argument version. |
Firefox Android Full support 55 Full support 55 Partial support 22 Notes' Version 54 or older didn't support parentheses-less one-argument version. Partial support 20 Disabled' From version 20: this feature is behind the |
Opera Android
Full support 12.1 |
Safari iOS
Full support Yes |
Samsung Internet Android Full support 8.0 Full support 8.0 Partial support 1.5 Notes' Samsung Internet 8.0 or older didn't support parentheses-less one-argument version. |
Legend
- Full support
- Full support
- Partial support
- Partial support
- No support
- No support
- See implementation notes.'
- See implementation notes.
- User must explicitly enable this feature.'
- User must explicitly enable this feature.
See also
- The
@supports
at-rule that allows for the same functionality but in a declarative way. - The
CSSSupportsRule
CSSOM class allowing to manipulate@supports
at-rules.
CSS.supports() by Mozilla Contributors is licensed under CC-BY-SA 2.5.