From 33058f2b292b3a581333bdfb21b8f671898c5060 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:40:17 -0500 Subject: initial commit --- files/zh-cn/web/api/cssrule/csstext/index.html | 37 ++++ files/zh-cn/web/api/cssrule/index.html | 234 +++++++++++++++++++++ .../web/api/cssrule/parentstylesheet/index.html | 36 ++++ 3 files changed, 307 insertions(+) create mode 100644 files/zh-cn/web/api/cssrule/csstext/index.html create mode 100644 files/zh-cn/web/api/cssrule/index.html create mode 100644 files/zh-cn/web/api/cssrule/parentstylesheet/index.html (limited to 'files/zh-cn/web/api/cssrule') diff --git a/files/zh-cn/web/api/cssrule/csstext/index.html b/files/zh-cn/web/api/cssrule/csstext/index.html new file mode 100644 index 0000000000..6f83ef0b53 --- /dev/null +++ b/files/zh-cn/web/api/cssrule/csstext/index.html @@ -0,0 +1,37 @@ +--- +title: CSSRule.cssText +slug: Web/API/CSSRule/cssText +translation_of: Web/API/CSSRule/cssText +--- +
+
{{ APIRef("CSSOM") }}
+
+ +
 
+ +
概述
+ +

cssText 返回样式规则所包含的实际文本.想要能够动态的设置一个样式表规则,查看使用动态样式信息.

+ +

语法

+ +
string = cssRule.cssText
+
+ +

例子

+ +
<style>
+body { background-color: darkblue; }
+</style>
+<script>
+  var stylesheet = document.styleSheets[0];
+  alert(stylesheet.cssRules[0].cssText); // body { background-color: darkblue; }
+</script>
+
+
+ +

规范

+ + diff --git a/files/zh-cn/web/api/cssrule/index.html b/files/zh-cn/web/api/cssrule/index.html new file mode 100644 index 0000000000..184e25376b --- /dev/null +++ b/files/zh-cn/web/api/cssrule/index.html @@ -0,0 +1,234 @@ +--- +title: CSSRule +slug: Web/API/CSSRule +tags: + - API + - CSSOM + - 参考 + - 接口 +translation_of: Web/API/CSSRule +--- +
{{APIRef("CSSOM")}}
+ +

CSSRule 接口表示一条 CSS 规则。有几种不同的规则类型，在下面的{{anch("类型常量")}}部分中有悉数列出。

+ +

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

+ +

可以通过 {{domxref("CSSStyleSheet")}} 的 cssRules 列表了解更多关于 CSSRule 的介绍。

+ +

所有 CSSRule 实例共有的属性

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

常量

+ +

类型常量

+ +

CSSRule接口通过一系列整型常量来约束CSSRule的{{domxref("cssRule/type","type")}}取值范围，同时这些常量也对应规则的具体实现接口。这些常量和接口的对应关系如下：

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
类型值对应接口备注与示例
CSSRule.STYLE_RULE1{{domxref("CSSStyleRule")}}最常见的一种规则。
+ selector { prop1: val1; prop2: val2; }
CSSRule.IMPORT_RULE3{{domxref("CSSImportRule")}}一条 {{cssxref("@import")}} 规则。(Until the documentation is completed, see the interface definition in the Mozilla source code: nsIDOMCSSImportRule.)
CSSRule.MEDIA_RULE4{{domxref("CSSMediaRule")}}
CSSRule.FONT_FACE_RULE5{{domxref("CSSFontFaceRule")}}
CSSRule.PAGE_RULE6{{domxref("CSSPageRule")}}
CSSRule.KEYFRAMES_RULE7{{domxref("CSSKeyframesRule")}} {{experimental_inline}}
CSSRule.KEYFRAME_RULE8{{domxref("CSSKeyframeRule")}} {{experimental_inline}}
Reserved for future use9应当会在将来被用于定义颜色配置
CSSRule.NAMESPACE_RULE10{{domxref("CSSNamespaceRule")}} {{experimental_inline}}
CSSRule.COUNTER_STYLE_RULE11{{domxref("CSSCounterStyleRule")}} {{experimental_inline}}
CSSRule.SUPPORTS_RULE12{{domxref("CSSSupportsRule")}}
CSSRule.DOCUMENT_RULE13{{domxref("CSSDocumentRule")}} {{experimental_inline}}
CSSRule.FONT_FEATURE_VALUES_RULE14{{domxref("CSSFontFeatureValuesRule")}}
CSSRule.VIEWPORT_RULE15{{domxref("CSSViewportRule")}} {{experimental_inline}}
CSSRule.REGION_STYLE_RULE16{{domxref("CSSRegionStyleRule")}} {{experimental_inline}}
CSSRule.UNKNOWN_RULE0{{domxref("CSSUnknownRule")}} {{obsolete_inline}}
CSSRule.CHARSET_RULE2CSSCharsetRule {{obsolete_inline}}（已在大多数浏览器中被移除）
+ +

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;
+};
+ +

规范

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
规范状态备注
{{SpecName('CSSOM', '#css-rules', 'CSSRule')}}{{Spec2('CSSOM')}}Obsoleted values CHARSET_RULE and UNKNOWN_RULE. Added value NAMESPACE_RULE.
{{SpecName("CSS3 Animations",'#interface-cssrule', 'CSSRule')}}{{Spec2('CSS3 Animations')}}Added values KEYFRAMES_RULE and KEYFRAME_RULE.
{{SpecName('CSS4 Fonts', '#om-fontfeaturevalues', 'CSSRule')}}{{Spec2('CSS4 Fonts')}}Added value FONT_FEATURE_VALUES_RULE.
{{SpecName("CSS3 Counter Styles", "#extentions-to-cssrule-interface", 'CSSRule')}}{{Spec2("CSS3 Counter Styles")}}Added value COUNTER_STYLE_RULE.
{{SpecName("CSS3 Conditional", '#extentions-to-cssrule-interface', 'CSSRule')}}{{Spec2('CSS3 Conditional')}}Added value SUPPORTS_RULE. (DOCUMENT_RULE has been pushed to CSS Conditional Rules Level 4)
{{SpecName('DOM2 Style', 'css.html#CSS-CSSRule', 'CSSRule')}}{{Spec2('DOM2 Style')}}Initial definition.
+ +

浏览器兼容性

+ + + +

{{Compat("api.CSSRule")}}

+ +

相关

+ + diff --git a/files/zh-cn/web/api/cssrule/parentstylesheet/index.html b/files/zh-cn/web/api/cssrule/parentstylesheet/index.html new file mode 100644 index 0000000000..a630c0d29d --- /dev/null +++ b/files/zh-cn/web/api/cssrule/parentstylesheet/index.html @@ -0,0 +1,36 @@ +--- +title: CSSRule.parentStyleSheet +slug: Web/API/CSSRule/parentStyleSheet +translation_of: Web/API/CSSRule/parentStyleSheet +--- +

{{ APIRef("CSSOM") }}

+ +

概述

+ +

parentStyleSheet 返回在当前规则中已定义的样式表对象。

+ +

语法

+ +
stylesheet = cssRule.parentStyleSheet
+
+ +

参数

+ + + +

例子

+ +
if ( bgRule.parentStyleSheet != mySheet ) {
+   // alien style rule!
+}
+
+ +

备注

+ +

查看 Gecko DOM Reference:event#DOM_styleSheet_Object 有关样式表的对象接口的详细信息。

+ +

规范

+ +

DOM Level 2 Style - cssRule

-- cgit v1.2.3-54-g00ecf