CSSSupportsRule
Baseline
広く利用可能
この機能は広く実装されており、多くのバージョンの端末やブラウザーで動作します。2015年9月以降、すべてのブラウザーで利用可能です。
CSSSupportsRule インターフェイスは、1 個の CSS @supports アットルール を表すオブジェクトを表します。
インスタンスプロパティ
祖先である CSSConditionRule, CSSGroupingRule, CSSRule からプロパティを継承しています。
インスタンスメソッド
祖先である CSSConditionRule, CSSGroupingRule, CSSRule からメソッドを継承しています。
例
この CSS には CSS 機能クエリーとして @supports アットルールを使用しており、その中にスタイルルールを 1 つ含んでいます。これは document.styleSheets[0].cssRules が最初に返す CSSRule になります。
したがって、 myRules[0] は CSSSupportsRule オブジェクトを返します。
css
@supports (display: grid) {
body {
color: blue;
}
}
js
let myRules = document.styleSheets[0].cssRules;
console.log(myRules[0]); // CSSSupportsRule は機能クエリーを表す。
仕様書
| 仕様書 |
|---|
| CSS Conditional Rules Module Level 3 # the-csssupportsrule-interface |