CSSSupportsRule

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2015.

CSSSupportsRule 接口代表了一个单独的 CSS @supports At 规则。

实例属性

继承其祖先 CSSConditionRule、CSSGroupingRule 和 CSSRule 的属性。

实例方法

继承其祖先 CSSConditionRule、CSSGroupingRule 和 CSSRule 的方法。

示例

CSS 中包含了一个使用 @supports At 规则的 CSS 特性查询，其中含有一条样式规则。这将会是 document.styleSheets[0].cssRules 返回的第一个 CSSRule。因此，myRules[0] 返回的是一个 CSSSupportsRule 对象。

css

@supports (display: grid) {
  body {
    color: blue;
  }
}

let myRules = document.styleSheets[0].cssRules;
console.log(myRules[0]); // 一个表示特性查询的 CSSSupportsRule 对象。

规范

Specification
CSS Conditional Rules Module Level 3 # the-csssupportsrule-interface

浏览器兼容性

BCD tables only load in the browser

参见

@supports