CSSRule

CSSRule 接口表示一条 CSS 规则。有几种不同的规则类型,在下面的类型常量部分中有悉数列出。

CSSRule 接口指定了所有类型的规则的公共属性,而特定类型的规则的专有属性则在这些规则各自类型的、更专用的接口中被指定。

可以通过 CSSStyleSheetcssRules 列表了解更多关于 CSSRule 的介绍。

所有 CSSRule 实例共有的属性

CSSRule.cssText
返回规则的文本表示. 例如 "h1,h2 { font-size: 16pt }"
CSSRule.parentRule (en-US) 只读
返回包含规则,否则返回 null。例如:如果此规则是 @media 块中的样式规则, 则其父规则将是该 CSSMediaRule
CSSRule.parentStyleSheet 只读
返回包含此规则的样式表的 CSSStyleSheet 对象。
CSSRule.type (en-US) 只读
规则类型,表示 CSS 规则类型 类型常量 中的一种类型。

常量

类型常量

CSSRule接口通过一系列整型常量来约束CSSRule的type (en-US)取值范围,同时这些常量也对应规则的具体实现接口。这些常量和接口的对应关系如下:

类型 对应接口 备注与示例
CSSRule.STYLE_RULE 1 CSSStyleRule 最常见的一种规则。
selector { prop1: val1; prop2: val2; }
CSSRule.IMPORT_RULE 3 CSSImportRule (en-US) 一条 @import 规则。(Until the documentation is completed, see the interface definition in the Mozilla source code: nsIDOMCSSImportRule.)
CSSRule.MEDIA_RULE 4 CSSMediaRule
CSSRule.FONT_FACE_RULE 5 CSSFontFaceRule (en-US)
CSSRule.PAGE_RULE 6 CSSPageRule
CSSRule.KEYFRAMES_RULE 7 CSSKeyframesRule (en-US) 这是一个实验性的 API,请尽量不要在生产环境中使用它。
CSSRule.KEYFRAME_RULE 8 CSSKeyframeRule (en-US) 这是一个实验性的 API,请尽量不要在生产环境中使用它。
Reserved for future use 9 应当会在将来被用于定义颜色配置
CSSRule.NAMESPACE_RULE 10 CSSNamespaceRule (en-US) 这是一个实验性的 API,请尽量不要在生产环境中使用它。
CSSRule.COUNTER_STYLE_RULE 11 CSSCounterStyleRule (en-US) 这是一个实验性的 API,请尽量不要在生产环境中使用它。
CSSRule.SUPPORTS_RULE 12 CSSSupportsRule
CSSRule.DOCUMENT_RULE 13 CSSDocumentRule 这是一个实验性的 API,请尽量不要在生产环境中使用它。
CSSRule.FONT_FEATURE_VALUES_RULE 14 CSSFontFeatureValuesRule
CSSRule.VIEWPORT_RULE 15 CSSViewportRule 这是一个实验性的 API,请尽量不要在生产环境中使用它。
CSSRule.REGION_STYLE_RULE 16 CSSRegionStyleRule 这是一个实验性的 API,请尽量不要在生产环境中使用它。
CSSRule.UNKNOWN_RULE 0 CSSUnknownRule This is an obsolete API and is no longer guaranteed to work.
CSSRule.CHARSET_RULE 2 CSSCharsetRule This is an obsolete API and is no longer guaranteed to work. (已在大多数浏览器中被移除)

An up-to-date informal list of constants can be found on the CSSWG Wiki.

语法

使用 WebIDL 语法格式进行描述。

interface CSSRule {
    const unsigned short STYLE_RULE = 1;
    const unsigned short CHARSET_RULE = 2;
    const unsigned short IMPORT_RULE = 3;
    const unsigned short MEDIA_RULE = 4;
    const unsigned short FONT_FACE_RULE = 5;
    const unsigned short PAGE_RULE = 6;
    const unsigned short KEYFRAMES_RULE = 7;
    const unsigned short KEYFRAME_RULE = 8;
    const unsigned short NAMESPACE_RULE = 10;
    const unsigned short COUNTER_STYLE_RULE = 11;
    const unsigned short SUPPORTS_RULE = 12;
    const unsigned short DOCUMENT_RULE = 13;
    const unsigned short FONT_FEATURE_VALUES_RULE = 14;
    const unsigned short VIEWPORT_RULE = 15;
    const unsigned short REGION_STYLE_RULE = 16;
    readonly attribute unsigned short type;
    attribute DOMString cssText;
    readonly attribute CSSRule? parentRule;
    readonly attribute CSSStyleSheet? parentStyleSheet;
};

规范

规范 状态 备注
CSS Object Model (CSSOM)
CSSRule
Working Draft Obsoleted values CHARSET_RULE and UNKNOWN_RULE. Added value NAMESPACE_RULE.
CSS Animations Level 1
CSSRule
Working Draft Added values KEYFRAMES_RULE and KEYFRAME_RULE.
CSS Fonts Module Level 4
CSSRule
Working Draft Added value FONT_FEATURE_VALUES_RULE.
CSS Counter Styles Level 3
CSSRule
Candidate Recommendation Added value COUNTER_STYLE_RULE.
CSS Conditional Rules Module Level 3
CSSRule
Candidate Recommendation Added value SUPPORTS_RULE. (DOCUMENT_RULE has been pushed to CSS Conditional Rules Level 4)
Document Object Model (DOM) Level 2 Style Specification
CSSRule
Obsolete Initial definition.

浏览器兼容性

BCD tables only load in the browser

相关