CSS Conditional Rules

CSS Conditional Rules is a CSS module that allows to define a set of rules that will only apply based on the capabilities of the processor or the document the style sheet is being applied to.

Reference

At-rules

Specifications

Specification	Status	Comment
CSS Conditional Rules Module Level 3	Candidate Recommendation	Initial definition

Browser compatibility

`@document` rule

Update compatibility data on GitHub

	Desktop						Mobile
	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari	Android webview	Chrome for Android	Firefox for Android	Opera for Android	Safari on iOS	Samsung Internet
`@document` ExperimentalNon-standard	Chrome No support No	Edge No support No	Firefox Full support 61 Prefixed Notes Disabled Full support 61 Prefixed Notes Disabled Prefixed Implemented with the vendor prefix: -moz- Notes Disabled by default in web pages, except for an empty `url-prefix()` value, which is supported due to its use in Firefox browser detection. Still supported in user stylesheets. Disabled From version 61: this feature is behind the `layout.css.moz-document.content.enabled` preference (needs to be set to `true`). To change preferences in Firefox, visit about:config. No support 1.5 — 61 Prefixed Prefixed Implemented with the vendor prefix: -moz-	IE No support No	Opera No support No	Safari No support No	WebView Android No support No	Chrome Android No support No	Firefox Android Full support 61 Prefixed Notes Disabled Full support 61 Prefixed Notes Disabled Prefixed Implemented with the vendor prefix: -moz- Notes Disabled by default in web pages, except for an empty `url-prefix()` value, which is supported due to its use in Firefox browser detection. Still supported in user stylesheets. Disabled From version 61: this feature is behind the `layout.css.moz-document.content.enabled` preference (needs to be set to `true`). To change preferences in Firefox, visit about:config. No support 4 — 61 Prefixed Prefixed Implemented with the vendor prefix: -moz-	Opera Android No support No	Safari iOS No support No	Samsung Internet Android No support No
`regexp()` ExperimentalNon-standard	Chrome No support No	Edge No support No	Firefox Full support 6	IE No support No	Opera No support No	Safari No support No	WebView Android No support No	Chrome Android No support No	Firefox Android Full support 6	Opera Android No support No	Safari iOS No support No	Samsung Internet Android No support No

Legend

Full support: Full support
No support: No support
Experimental. Expect behavior to change in the future.: Experimental. Expect behavior to change in the future.
Non-standard. Expect poor cross-browser support.: Non-standard. Expect poor cross-browser support.
See implementation notes.: See implementation notes.
User must explicitly enable this feature.: User must explicitly enable this feature.
Requires a vendor prefix or different name for use.: Requires a vendor prefix or different name for use.

`@import` rule

Update compatibility data on GitHub

	Desktop						Mobile
	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari	Android webview	Chrome for Android	Firefox for Android	Opera for Android	Safari on iOS	Samsung Internet
`@import`	Chrome Full support 1	Edge Full support 12	Firefox Full support 1	IE Full support 5.5	Opera Full support 3.5	Safari Full support 1	WebView Android Full support ≤37	Chrome Android Full support 18	Firefox Android Full support 4	Opera Android Full support 10.1	Safari iOS Full support 1	Samsung Internet Android Full support 1.0

Legend

Full support: Full support

`@media` rule

Update compatibility data on GitHub

	Desktop						Mobile
	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari	Android webview	Chrome for Android	Firefox for Android	Opera for Android	Safari on iOS	Samsung Internet
`@media`	Chrome Full support 1	Edge Full support 12	Firefox Full support 1	IE Full support 6	Opera Full support 9.2	Safari Full support 1.3	WebView Android Full support 1	Chrome Android Full support 18	Firefox Android Full support 4	Opera Android Full support 10.1	Safari iOS Full support 1	Samsung Internet Android Full support 1.0
`any-hover` media feature	Chrome Full support 41	Edge Full support 16	Firefox Full support 64	IE No support No	Opera Full support 28	Safari Full support 9	WebView Android Full support 41	Chrome Android Full support 41	Firefox Android Full support 64	Opera Android Full support 28	Safari iOS Full support 9	Samsung Internet Android Full support 5.0
`any-pointer` media feature	Chrome Full support 41	Edge Full support 12	Firefox Full support 64	IE No support No	Opera Full support 28	Safari Full support 9	WebView Android Full support 41	Chrome Android Full support 41	Firefox Android Full support 64	Opera Android Full support 28	Safari iOS Full support 9	Samsung Internet Android Full support 4.0
`aspect-ratio` media feature	Chrome Full support 3	Edge Full support 12	Firefox Full support 3.5	IE Full support 9	Opera Full support 10	Safari Full support 5	WebView Android Full support ≤37	Chrome Android Full support 18	Firefox Android Full support 4	Opera Android Full support 10.1	Safari iOS Full support 4.2	Samsung Internet Android Full support 1.0
`calc()` expressions	Chrome Full support 66	Edge Full support 79	Firefox Full support 59	IE No support No	Opera Full support 53	Safari Full support 12	WebView Android Full support 66	Chrome Android Full support 66	Firefox Android Full support 59	Opera Android Full support 47	Safari iOS Full support 12	Samsung Internet Android Full support 9.0
`color` media feature	Chrome Full support 1	Edge Full support 12	Firefox Full support 2	IE Full support 9	Opera Full support 10	Safari Full support 3	WebView Android Full support ≤37	Chrome Android Full support 18	Firefox Android Full support 4	Opera Android Full support 10.1	Safari iOS Full support 1	Samsung Internet Android Full support 1.0
`color-gamut` media feature	Chrome Full support 58	Edge Full support 79	Firefox No support No	IE No support No	Opera Full support 45	Safari Full support 10	WebView Android Full support 58	Chrome Android Full support 58	Firefox Android No support No	Opera Android Full support 43	Safari iOS Full support 10	Samsung Internet Android Full support 7.0
`color-index` media feature	Chrome Full support 29	Edge Full support 79	Firefox No support No	IE No support No	Opera Full support 16	Safari Full support 8	WebView Android Full support ≤37	Chrome Android Full support 29	Firefox Android No support No	Opera Android Full support 16	Safari iOS Full support 8	Samsung Internet Android Full support 2.0
`device-aspect-ratio` media feature DeprecatedNon-standard	Chrome Full support 1	Edge Full support 12	Firefox Full support 2	IE Full support 9	Opera Full support 10	Safari Full support 3	WebView Android Full support ≤37	Chrome Android Full support 18	Firefox Android Full support 4	Opera Android Full support 10.1	Safari iOS Full support 1	Samsung Internet Android Full support 1.0
`device-height` media feature DeprecatedNon-standard	Chrome Full support 1	Edge Full support 12	Firefox Full support 2	IE Full support 9	Opera Full support 10	Safari Full support 3	WebView Android Full support ≤37	Chrome Android Full support 18	Firefox Android Full support 4	Opera Android Full support 10.1	Safari iOS Full support 1	Samsung Internet Android Full support 1.0
`device-width` media feature DeprecatedNon-standard	Chrome Full support 1	Edge Full support 12	Firefox Full support 2	IE Full support 9	Opera Full support 10	Safari Full support 3	WebView Android Full support ≤37	Chrome Android Full support 18	Firefox Android Full support 4	Opera Android Full support 10.1	Safari iOS Full support 1	Samsung Internet Android Full support 1.0
`display-mode` media feature	Chrome Full support 45	Edge Full support 79	Firefox Full support 47 Notes Full support 47 Notes Notes Firefox 47 and later support `display-mode` values `fullscreen` and `browser`. Firefox 57 added support for `minimal-ui` and `standalone` values.	IE No support No	Opera Full support 32	Safari Full support 13	WebView Android Full support 45	Chrome Android Full support 45	Firefox Android Full support 47 Notes Full support 47 Notes Notes Firefox 47 and later support `display-mode` values `fullscreen` and `browser`. Firefox 57 added support for `minimal-ui` and `standalone` values.	Opera Android Full support 32	Safari iOS Full support 13	Samsung Internet Android Full support 5.0
`forced-colors` media feature Experimental	Chrome Full support 79 Notes Disabled Full support 79 Notes Disabled Notes See bug 970285. Disabled From version 79: this feature is behind the `#forced-colors` preference (needs to be set to `Enabled`). To change preferences in Chrome, visit chrome://flags.	Edge Full support 79	Firefox Full support 81 Disabled Full support 81 Disabled Disabled From version 81: this feature is behind the `layout.css.forced-colors.enabled` preference (needs to be set to `true`). To change preferences in Firefox, visit about:config.	IE No support No	Opera No support No	Safari No support No	WebView Android No support No Notes No support No Notes Notes See bug 970285.	Chrome Android No support No Notes No support No Notes Notes See bug 970285.	Firefox Android No support No	Opera Android No support No	Safari iOS No support No	Samsung Internet Android No support No Notes No support No Notes Notes See bug 970285.
`grid` media feature	Chrome Full support 1	Edge Full support 12	Firefox Full support 2	IE Full support 10	Opera Full support 10	Safari Full support 3	WebView Android Full support ≤37	Chrome Android Full support 18	Firefox Android Full support 4	Opera Android Full support 10.1	Safari iOS Full support 1	Samsung Internet Android Full support 1.0
`height` media feature	Chrome Full support 1	Edge Full support 12	Firefox Full support 2	IE Full support 9	Opera Full support 10	Safari Full support 3	WebView Android Full support ≤37	Chrome Android Full support 18	Firefox Android Full support 4	Opera Android Full support 10.1	Safari iOS Full support 1	Samsung Internet Android Full support 1.0
`hover` media feature	Chrome Full support 38 Notes Full support 38 Notes Notes Before Chrome 41, the implementation was buggy and reported `(hover: none)` on non-touch-based computers with a mouse/trackpad. See bug 441613.	Edge Full support 12	Firefox Full support 64	IE No support No	Opera Full support 28	Safari Full support 9	WebView Android Full support 38 Notes Full support 38 Notes Notes Before Chrome 41, the implementation was buggy and reported `(hover: none)` on non-touch-based computers with a mouse/trackpad. See bug 441613.	Chrome Android Full support 50	Firefox Android Full support 64	Opera Android Full support 28	Safari iOS Full support 9	Samsung Internet Android Full support 5.0
`inverted-colors` media feature	Chrome No support No	Edge No support No	Firefox No support No	IE No support No	Opera No support No	Safari Full support 9.1	WebView Android No support No	Chrome Android No support No	Firefox Android No support No	Opera Android No support No	Safari iOS Full support 10	Samsung Internet Android No support No
Media feature expressions	Chrome Full support 1	Edge Full support 12	Firefox Full support 1	IE Full support 9	Opera Full support 9.2	Safari Full support 1.3	WebView Android Full support 1	Chrome Android Full support 18	Firefox Android Full support 4	Opera Android Full support 10.1	Safari iOS Full support 3.1	Samsung Internet Android Full support 1.0
Media query value support	Chrome Full support 66	Edge Full support 79	Firefox Full support 59	IE No support No	Opera Full support 53	Safari No support No	WebView Android Full support 66	Chrome Android Full support 66	Firefox Android Full support 59	Opera Android Full support 47	Safari iOS No support No	Samsung Internet Android Full support 9.0
`monochrome` media feature	Chrome Full support 1	Edge Full support 79	Firefox Full support 2	IE No support No	Opera Full support 10	Safari Full support 3	WebView Android Full support ≤37	Chrome Android Full support 18	Firefox Android Full support 4	Opera Android Full support 10.1	Safari iOS Full support 1	Samsung Internet Android Full support 1.0
Nested media queries	Chrome Full support 26	Edge Full support 12	Firefox Full support 11	IE No support No	Opera Full support 12.1	Safari Full support 6.1	WebView Android Full support ≤37	Chrome Android Full support 26	Firefox Android Full support 14	Opera Android Full support 12.1	Safari iOS Full support 7	Samsung Internet Android Full support 1.5
`orientation` media feature	Chrome Full support 3	Edge Full support 12	Firefox Full support 2	IE Full support 9	Opera Full support 10.6	Safari Full support 5	WebView Android Full support ≤37	Chrome Android Full support 18	Firefox Android Full support 4	Opera Android Full support 11	Safari iOS Full support 4.2	Samsung Internet Android Full support 1.0
`overflow-block` media feature	Chrome No support No	Edge No support No	Firefox Full support 66	IE No support No	Opera No support No	Safari No support No	WebView Android No support No	Chrome Android No support No	Firefox Android Full support 66	Opera Android No support No	Safari iOS No support No	Samsung Internet Android No support No
`overflow-inline` media feature	Chrome No support No	Edge No support No	Firefox Full support 66	IE No support No	Opera No support No	Safari No support No	WebView Android No support No	Chrome Android No support No	Firefox Android Full support 66	Opera Android No support No	Safari iOS No support No	Samsung Internet Android No support No
`pointer` media feature	Chrome Full support 41	Edge Full support 12	Firefox Full support 64	IE No support No	Opera Full support 28	Safari Full support 9	WebView Android Full support 41	Chrome Android Full support 50	Firefox Android Full support 64	Opera Android Full support 28	Safari iOS Full support 9	Samsung Internet Android Full support 5.0
`prefers-color-scheme` media feature	Chrome Full support 76	Edge Full support 79	Firefox Full support 67	IE No support No	Opera Full support 62	Safari Full support 12.1	WebView Android Full support 76	Chrome Android Full support 76	Firefox Android No support No	Opera Android Full support 54	Safari iOS Full support 13	Samsung Internet Android Full support 12.0
`prefers-contrast` media feature Experimental	Chrome No support No	Edge No support No	Firefox Full support 80 Disabled Full support 80 Disabled Disabled From version 80: this feature is behind the `layout.css.prefers-contrast.enabled` preference (needs to be set to `true`). To change preferences in Firefox, visit about:config.	IE No support No	Opera No support No	Safari No support No	WebView Android No support No	Chrome Android No support No	Firefox Android No support No	Opera Android No support No	Safari iOS No support No	Samsung Internet Android No support No
`prefers-reduced-data` media feature Experimental	Chrome Full support 85 Notes Disabled Full support 85 Notes Disabled Notes See bug 1051189. Disabled From version 85: this feature is behind the `#enable-experimental-web-platform-features` preference (needs to be set to `Enabled`). To change preferences in Chrome, visit chrome://flags.	Edge Full support 85 Notes Disabled Full support 85 Notes Disabled Notes See bug 1051189. Disabled From version 85: this feature is behind the `#enable-experimental-web-platform-features` preference (needs to be set to `Enabled`).	Firefox No support No	IE No support No	Opera No support No	Safari No support No	WebView Android No support No Notes No support No Notes Notes See bug 1051189.	Chrome Android Full support 85 Notes Disabled Full support 85 Notes Disabled Notes See bug 1051189. Disabled From version 85: this feature is behind the `#enable-experimental-web-platform-features` preference (needs to be set to `Enabled`). To change preferences in Chrome, visit chrome://flags.	Firefox Android No support No	Opera Android No support No	Safari iOS No support No	Samsung Internet Android No support No
`prefers-reduced-motion` media feature	Chrome Full support 74	Edge Full support 79	Firefox Full support 63	IE No support No	Opera Full support 62	Safari Full support 10.1	WebView Android Full support 74	Chrome Android Full support 74	Firefox Android Full support 64	Opera Android Full support 53	Safari iOS Full support 10.3	Samsung Internet Android Full support 11.0
`prefers-reduced-transparency` media feature Experimental	Chrome No support No	Edge No support No	Firefox No support No	IE No support No	Opera No support No	Safari No support No	WebView Android No support No	Chrome Android No support No	Firefox Android No support No	Opera Android No support No	Safari iOS No support No	Samsung Internet Android No support No
`resolution` media feature	Chrome Full support 29	Edge Full support 12	Firefox Full support 8 Full support 8 Partial support 3.5 Notes Notes Supports `<integer>` values only.	IE Full support 9	Opera Full support 16 Full support 16 No support 10 — 15	Safari No support No Notes No support No Notes Notes See bug 78087.	WebView Android Full support ≤37	Chrome Android Full support 29	Firefox Android Full support 8 Full support 8 Partial support 4 Notes Notes Supports `<integer>` values only.	Opera Android Full support 16 Full support 16 No support 10.1 — 14	Safari iOS No support No Notes No support No Notes Notes See bug 78087.	Samsung Internet Android Full support 2.0
`scan` media feature	Chrome No support No	Edge No support No	Firefox No support No	IE No support No	Opera No support No	Safari No support No	WebView Android No support No	Chrome Android No support No	Firefox Android No support No	Opera Android No support No	Safari iOS No support No	Samsung Internet Android No support No
`scripting` media feature	Chrome No support No Notes No support No Notes Notes See bug 489957.	Edge No support No Notes No support No Notes Notes See bug 489957.	Firefox No support No Notes No support No Notes Notes See bug 1166581.	IE No support No	Opera No support No	Safari No support No	WebView Android No support No Notes No support No Notes Notes See bug 489957.	Chrome Android No support No Notes No support No Notes Notes See bug 489957.	Firefox Android No support No Notes No support No Notes Notes See bug 1166581.	Opera Android No support No	Safari iOS No support No	Samsung Internet Android No support No Notes No support No Notes Notes See bug 489957.
`speech` media type	Chrome No support No	Edge No support No	Firefox No support No	IE No support No	Opera Full support 9.2	Safari No support No	WebView Android No support No	Chrome Android No support No	Firefox Android No support No	Opera Android Full support 10.1	Safari iOS No support No	Samsung Internet Android No support No
`update` media feature	Chrome No support No	Edge No support No	Firefox No support No	IE No support No	Opera No support No	Safari No support No	WebView Android No support No	Chrome Android No support No	Firefox Android No support No	Opera Android No support No	Safari iOS No support No	Samsung Internet Android No support No
`width` media feature	Chrome Full support 1	Edge Full support 12	Firefox Full support 2	IE Full support 9	Opera Full support 10	Safari Full support 3	WebView Android Full support ≤37	Chrome Android Full support 18	Firefox Android Full support 4	Opera Android Full support 10.1	Safari iOS Full support 1	Samsung Internet Android Full support 1.0
`-moz-device-pixel-ratio` media feature DeprecatedNon-standard	Chrome No support No	Edge No support No	Firefox Full support 4	IE No support No	Opera No support No	Safari No support No	WebView Android No support No	Chrome Android No support No	Firefox Android Full support 4	Opera Android No support No	Safari iOS No support No	Samsung Internet Android No support No
`-webkit-animation` media feature DeprecatedNon-standard	Chrome No support 2 — 36	Edge No support No	Firefox No support No	IE No support No	Opera No support 15 — 23	Safari Full support 4	WebView Android No support ≤37 — ≤37	Chrome Android No support 18 — 36	Firefox Android No support No	Opera Android No support 14 — 24	Safari iOS Full support 3.2	Samsung Internet Android No support 1.0 — 3.0
`-webkit-device-pixel-ratio` media feature Non-standard	Chrome Full support 1	Edge Full support 12	Firefox Full support 63 Notes Full support 63 Notes Notes Implemented as an alias for for `-moz-device-pixel-ratio`. Full support 49 Notes Disabled Notes Implemented as an alias for for `-moz-device-pixel-ratio`. Disabled From version 49: this feature is behind the `layout.css.prefixes.device-pixel-ratio-webkit` preference (needs to be set to `true`). To change preferences in Firefox, visit about:config. Full support 45 Notes Disabled Notes Implemented as an alias for for `-moz-device-pixel-ratio`. Disabled From version 45: this feature is behind the `layout.css.prefixes.webkit` preference (needs to be set to `true`) and the `layout.css.prefixes.device-pixel-ratio-webkit` preference (needs to be set to `true`). To change preferences in Firefox, visit about:config.	IE No support No	Opera Full support 15	Safari Full support 3	WebView Android Full support ≤37	Chrome Android Full support 18	Firefox Android Full support 63 Notes Full support 63 Notes Notes Implemented as an alias for for `-moz-device-pixel-ratio`. Full support 49 Notes Disabled Notes Implemented as an alias for for `-moz-device-pixel-ratio`. Disabled From version 49: this feature is behind the `layout.css.prefixes.device-pixel-ratio-webkit` preference (needs to be set to `true`). To change preferences in Firefox, visit about:config. Full support 45 Notes Disabled Notes Implemented as an alias for for `-moz-device-pixel-ratio`. Disabled From version 45: this feature is behind the `layout.css.prefixes.webkit` preference (needs to be set to `true`) and the `layout.css.prefixes.device-pixel-ratio-webkit` preference (needs to be set to `true`). To change preferences in Firefox, visit about:config.	Opera Android Full support 14	Safari iOS Full support 1	Samsung Internet Android Full support 1.0
`-webkit-max-device-pixel-ratio` media feature Non-standard	Chrome Full support 1	Edge Full support 12	Firefox Full support 63 Notes Full support 63 Notes Notes Implemented as an alias for for `max--moz-device-pixel-ratio`. Full support 49 Notes Disabled Notes Implemented as an alias for for `max--moz-device-pixel-ratio`. Disabled From version 49: this feature is behind the `layout.css.prefixes.device-pixel-ratio-webkit` preference (needs to be set to `true`). To change preferences in Firefox, visit about:config. Full support 45 Notes Disabled Notes Implemented as an alias for for `max--moz-device-pixel-ratio`. Disabled From version 45: this feature is behind the `layout.css.prefixes.webkit` preference (needs to be set to `true`) and the `layout.css.prefixes.device-pixel-ratio-webkit` preference (needs to be set to `true`). To change preferences in Firefox, visit about:config.	IE No support No	Opera Full support 15	Safari Full support 3	WebView Android Full support ≤37	Chrome Android Full support 18	Firefox Android Full support 63 Notes Full support 63 Notes Notes Implemented as an alias for for `max--moz-device-pixel-ratio`. Full support 49 Notes Disabled Notes Implemented as an alias for for `max--moz-device-pixel-ratio`. Disabled From version 49: this feature is behind the `layout.css.prefixes.device-pixel-ratio-webkit` preference (needs to be set to `true`). To change preferences in Firefox, visit about:config. Full support 45 Notes Disabled Notes Implemented as an alias for for `max--moz-device-pixel-ratio`. Disabled From version 45: this feature is behind the `layout.css.prefixes.webkit` preference (needs to be set to `true`) and the `layout.css.prefixes.device-pixel-ratio-webkit` preference (needs to be set to `true`). To change preferences in Firefox, visit about:config.	Opera Android Full support 14	Safari iOS Full support 1	Samsung Internet Android Full support 1.0
`-webkit-min-device-pixel-ratio` media feature Non-standard	Chrome Full support 1	Edge Full support 12	Firefox Full support 63 Notes Full support 63 Notes Notes Implemented as an alias for for `min--moz-device-pixel-ratio`. Full support 49 Notes Disabled Notes Implemented as an alias for for `min--moz-device-pixel-ratio`. Disabled From version 49: this feature is behind the `layout.css.prefixes.device-pixel-ratio-webkit` preference (needs to be set to `true`). To change preferences in Firefox, visit about:config. Full support 45 Notes Disabled Notes Implemented as an alias for for `min--moz-device-pixel-ratio`. Disabled From version 45: this feature is behind the `layout.css.prefixes.webkit` preference (needs to be set to `true`) and the `layout.css.prefixes.device-pixel-ratio-webkit` preference (needs to be set to `true`). To change preferences in Firefox, visit about:config.	IE No support No	Opera Full support 15	Safari Full support 3	WebView Android Full support ≤37	Chrome Android Full support 18	Firefox Android Full support 63 Notes Full support 63 Notes Notes Implemented as an alias for for `min--moz-device-pixel-ratio`. Full support 49 Notes Disabled Notes Implemented as an alias for for `min--moz-device-pixel-ratio`. Disabled From version 49: this feature is behind the `layout.css.prefixes.device-pixel-ratio-webkit` preference (needs to be set to `true`). To change preferences in Firefox, visit about:config. Full support 45 Notes Disabled Notes Implemented as an alias for for `min--moz-device-pixel-ratio`. Disabled From version 45: this feature is behind the `layout.css.prefixes.webkit` preference (needs to be set to `true`) and the `layout.css.prefixes.device-pixel-ratio-webkit` preference (needs to be set to `true`). To change preferences in Firefox, visit about:config.	Opera Android Full support 14	Safari iOS Full support 1	Samsung Internet Android Full support 1.0
`-webkit-transform-2d` media feature Non-standard	Chrome No support 2 — 36	Edge No support No	Firefox No support No	IE No support No	Opera No support 15 — 23	Safari Full support 4	WebView Android No support ≤37 — ≤37	Chrome Android No support 18 — 36	Firefox Android No support No	Opera Android No support 14 — 24	Safari iOS Full support 3.2	Samsung Internet Android No support 1.0 — 3.0
`-webkit-transform-3d` media feature Non-standard	Chrome No support 2 — 36	Edge No support 12 — 79	Firefox Full support 49 Full support 49 Full support 46 Disabled Disabled From version 46: this feature is behind the `layout.css.prefixes.webkit` preference (needs to be set to `true`). To change preferences in Firefox, visit about:config.	IE No support No	Opera No support 15 — 23	Safari Full support 4	WebView Android No support ≤37 — ≤37	Chrome Android No support 18 — 36	Firefox Android Full support 49 Full support 49 Full support 46 Disabled Disabled From version 46: this feature is behind the `layout.css.prefixes.webkit` preference (needs to be set to `true`). To change preferences in Firefox, visit about:config.	Opera Android No support 14 — 24	Safari iOS Full support 3.2	Samsung Internet Android No support 1.0 — 3.0
`-webkit-transition` media feature DeprecatedNon-standard	Chrome No support 2 — 36	Edge No support No	Firefox No support No	IE No support No	Opera No support 15 — 23	Safari Full support 4	WebView Android No support ≤37 — ≤37	Chrome Android No support 18 — 36	Firefox Android No support No	Opera Android No support 14 — 24	Safari iOS Full support 3.2	Samsung Internet Android No support 1.0 — 3.0

Legend

Full support: Full support
No support: No support
Experimental. Expect behavior to change in the future.: Experimental. Expect behavior to change in the future.
Non-standard. Expect poor cross-browser support.: Non-standard. Expect poor cross-browser support.
Deprecated. Not for use in new websites.: Deprecated. Not for use in new websites.
See implementation notes.: See implementation notes.
User must explicitly enable this feature.: User must explicitly enable this feature.

`@supports` rule

Update compatibility data on GitHub

	Desktop						Mobile
	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari	Android webview	Chrome for Android	Firefox for Android	Opera for Android	Safari on iOS	Samsung Internet
`@supports`	Chrome Full support 28	Edge Full support 12	Firefox Full support 22 Full support 22 No support 17 — 22 Disabled Disabled From version 17 until version 22 (exclusive): this feature is behind the `layout.css.supports-rule.enabled` preference (needs to be set to `true`). To change preferences in Firefox, visit about:config.	IE No support No	Opera Full support 12.1	Safari Full support 9	WebView Android Full support ≤37	Chrome Android Full support 28	Firefox Android Full support 22 Full support 22 No support 17 — 22 Disabled Disabled From version 17 until version 22 (exclusive): this feature is behind the `layout.css.supports-rule.enabled` preference (needs to be set to `true`). To change preferences in Firefox, visit about:config.	Opera Android Full support 12.1	Safari iOS Full support 9	Samsung Internet Android Full support 1.5
`selector()`	Chrome Full support 83	Edge Full support 83	Firefox Full support 69 Full support 69 Full support 64 Disabled Disabled From version 64: this feature is behind the `layout.css.supports-selector.enabled` preference (needs to be set to `true`). To change preferences in Firefox, visit about:config.	IE No support No	Opera Full support 69	Safari No support No Notes No support No Notes Notes See bug 199237	WebView Android Full support 83	Chrome Android Full support 83	Firefox Android Full support 64 Disabled Full support 64 Disabled Disabled From version 64: this feature is behind the `layout.css.supports-selector.enabled` preference (needs to be set to `true`). To change preferences in Firefox, visit about:config.	Opera Android No support No Notes No support No Notes Notes See bug 979041.	Safari iOS No support No Notes No support No Notes Notes See bug 199237	Samsung Internet Android Full support 13.0

Legend

Full support: Full support
No support: No support
See implementation notes.: See implementation notes.
User must explicitly enable this feature.: User must explicitly enable this feature.

Reference

At-rules

Specifications

Browser compatibility

@document rule

Legend

@import rule

Legend

@media rule

Legend

@supports rule

Legend

学习 Web 开发的最佳实践

`@document` rule

`@import` rule

`@media` rule

`@supports` rule