We're looking for a user researcher to understand the needs of developers and designers. Is this you or someone you know? Check out the post: https://mzl.la/2IGzdXS

CSSRule インターフェイスは、1 つの CSS 規則を表します。いくつかある規則の種類は、下記の 型定数 セクションのリストを見てください。

CSSRule インターフェイスは、すべての規則に共通のプロパティを指定します。特定の種類の規則に特有のプロパティは、各種類の規則のための、さらに特別なインターフェース内で指定されています。

CSSRule への参照は、CSSStyleSheetcssRules のリストから探してください。

すべての CSSRule インスタンスに共通のプロパティ

CSSRule.cssText
規則のテキスト表現を表す。例: "h1,h2 { font-size: 16pt }" や "@import 'url'"。規則の部分 (つまり、この例の "font-size" の値) にアクセスまたは変更するには、規則の種類の特別なインターフェイス のプロパティ (型定数) を使用してください。
CSSRule.parentRule 読取専用
含まれている規則を返す。規則が含まれていなければ null を返す。つまり、この規則が @media ブロック内部のスタイル規則の場合、親規則は CSSMediaRule になります。
CSSRule.parentStyleSheet 読取専用
この規則を含むスタイルシートの CSSStyleSheet オブジェクトを返す。
CSSRule.type 読取専用
CSS 規則の種類を示すいずれかの 型定数

定数

型定数

CSSRule インターフェイスは、CSSRuletype プロパティと組み合わせて使用できる、規則の種類 (さらに、これを実装する特別なインターフェイス) を識別するための整数定数を指定します。これらの定数とインターフェイスの関係は、次のとおりです:

規則固有のインターフェイス 備考と使用例
CSSRule.STYLE_RULE 1 CSSStyleRule もっとも一般的な規則の種類:
selector { prop1: val1; prop2: val2; }
CSSRule.IMPORT_RULE 3 CSSImportRule @import 規則。(ドキュメントが完成するまで、インターフェイスの定義は Mozilla のソースコードを参照してください: nsIDOMCSSImportRule.)
CSSRule.MEDIA_RULE 4 CSSMediaRule
CSSRule.FONT_FACE_RULE 5 CSSFontFaceRule
CSSRule.PAGE_RULE 6 CSSPageRule
CSSRule.KEYFRAMES_RULE 7 CSSKeyframesRule
CSSRule.KEYFRAME_RULE 8 CSSKeyframeRule
将来使用するための予約領域 9 将来、カラープロファイルの定義に使用されます。
CSSRule.NAMESPACE_RULE 10 CSSNamespaceRule
CSSRule.COUNTER_STYLE_RULE 11 CSSCounterStyleRule
CSSRule.SUPPORTS_RULE 12 CSSSupportsRule
CSSRule.DOCUMENT_RULE 13 CSSDocumentRule
CSSRule.FONT_FEATURE_VALUES_RULE 14 CSSFontFeatureValuesRule
CSSRule.VIEWPORT_RULE 15 CSSViewportRule
CSSRule.REGION_STYLE_RULE 16 CSSRegionStyleRule
CSSRule.UNKNOWN_RULE 0 CSSUnknownRule
CSSRule.CHARSET_RULE 2 CSSCharsetRule (ほとんどのブラウザーから削除されました。)

定数の最新版の非公式リストは CSSWG Wiki で確認できます。

仕様

仕様書 策定状況 備考
CSS Object Model (CSSOM)
CSSRule の定義
草案 CHARSET_RULE 値と UNKNOWN_RULE 値を廃止。NAMESPACE_RULE 値を追加。
CSS Animations
CSSRule の定義
草案 KEYFRAMES_RULE 値と KEYFRAME_RULE 値を追加。
CSS Fonts Module Level 3
CSSRule の定義
勧告候補 FONT_FEATURE_VALUES_RULE 値を追加。
CSS Counter Styles Level 3
CSSRule の定義
勧告候補 COUNTER_STYLE_RULE 値を追加。
CSS Conditional Rules Module Level 3
CSSRule の定義
勧告候補 SUPPORTS_RULE 値を追加。(DOCUMENT_RULE は、CSS Conditional Rules Level 4 へ移された)
Document Object Model (DOM) Level 2 Style Specification
CSSRule の定義
廃止された 初期定義。

ブラウザーの実装状況

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!

機能 Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
基本サポート (有) (有) 9 (有) (有)
CSSKeyframesRule ? 20.0 [4] ? ? ?
CSSCharsetRule 未サポート [1] 未サポート [3] ? 未サポート ?
CSSUnknownRule 未サポート [2] ? ? ? ?
機能 Android Android Webview Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile Chrome for Android
基本サポート ? (有) (有) (有) (有) (有) (有)
CSSKeyframesRule ? ? 20.0 [4] ? ? ? ?
CSSCharsetRule ? 未サポート [1] 未サポート [3] ? 未サポート ? 未サポート [1]
CSSUnknownRule ? 未サポート [2] ? ? ? ? 未サポート [2]

[1] CSSCharsetRule は、Chrome 41.0 で削除されました。

[2] CSSUnknownRule は、Chrome 45.0 で削除されました。

[3] CSSCharsetRule は、Gecko 40 で削除されました。

[4] Firefox 19 以前の Gecko において、keyframe 関連の定数は、その接頭辞付きバージョンにのみ存在していました: CSSRule.MOZ_KEYFRAMES_RULE および CSSRule.MOZ_KEYFRAME_RULE。Firefox 20 以降は、接頭辞なしのバージョンも利用可能です。接頭辞付きのバージョンは将来のバージョンで削除されます。

関連情報

ドキュメントのタグと貢献者

このページの貢献者: Marsf, YuichiNukiyama, fscholz, ethertank, Sheppy
最終更新者: Marsf,