mozilla

Revision 85900 of CSSRule

  • Revision slug: DOM/cssRule
  • Revision title: CSSRule
  • Revision id: 85900
  • Created:
  • Creator: kitchin
  • Is current revision? No
  • Comment update link from external to internal; no wording changes

Revision Content

{{ DomRef() }}

The CSSRule object represents a single CSS style rule. It may be a part of a stylesheet's cssRules list.

There are several kinds of rules. All of them share a few common properties on the {{ Anch("CSSRule") }} interface and most of them have some properties specific to a particular rule type.

Type Rule-specific interface Description
CSSRule.STYLE_RULE {{ Anch("CSSStyleRule") }}  
CSSRule.MEDIA_RULE {{ Anch("CSSMediaRule") }}  
CSSRule.FONT_FACE_RULE {{ Anch("CSSFontFaceRule") }}  
CSSRule.PAGE_RULE {{ Anch("CSSPageRule") }}  
CSSRule.IMPORT_RULE {{ Anch("CSSImportRule") }}  
CSSRule.CHARSET_RULE {{ Anch("CSSCharsetRule") }}  
CSSRule.UNKNOWN_RULE {{ Anch("CSSUnknownRule") }}  

CSSRule

cssText 
Returns the textual representation of the rule, e.g. "h1,h2 { font-size: 16pt }".
parentRule 
Returns the containing rule, if any (e.g. a style rule inside an @media block).
parentStyleSheet 
Returns the stylesheet object that this rule is part of.
type 
The type of the rule, e.g. CSSRule.CHARSET_RULE or CSSRule.IMPORT_RULE.

CSSStyleRule

selectorText 
Gets/sets the textual representation of the selector for this rule, e.g. "h1,h2".
style 
Returns the CSSStyleDeclaration object for the declaration block of the rule.

CSSMediaRule

CSSFontFaceRule

CSSPageRule

CSSImportRule

CSSCharsetRule

CSSUnknownRule

Specification

DOM Level 2 CSS: CSSRule

{{ languages( { "pl": "pl/DOM/cssRule" } ) }}

Revision Source

<p>{{ DomRef() }}</p>
<p>The <code>CSSRule</code> object represents a single CSS style rule. It may be a part of a <a href="/en/DOM/stylesheet" title="en/DOM/stylesheet">stylesheet</a>'s <a href="/en/DOM/stylesheet.cssRules" title="en/DOM/stylesheet.cssRules">cssRules</a> list.</p>
<p>There are several kinds of rules. All of them share a few common properties on the {{ Anch("CSSRule") }} interface and most of them have some properties specific to a particular rule type.</p>
<table class="fullwidth-table"> <tbody> <tr> <th>Type</th> <th>Rule-specific interface</th> <th>Description</th> </tr> <tr> <td><code>CSSRule.STYLE_RULE</code></td> <td>{{ Anch("CSSStyleRule") }}</td> <td> </td> </tr> <tr> <td><code>CSSRule.MEDIA_RULE</code></td> <td>{{ Anch("CSSMediaRule") }}</td> <td> </td> </tr> <tr> <td><code>CSSRule.FONT_FACE_RULE</code></td> <td>{{ Anch("CSSFontFaceRule") }}</td> <td> </td> </tr> <tr> <td><code>CSSRule.PAGE_RULE</code></td> <td>{{ Anch("CSSPageRule") }}</td> <td> </td> </tr> <tr> <td><code>CSSRule.IMPORT_RULE</code></td> <td>{{ Anch("CSSImportRule") }}</td> <td> </td> </tr> <tr> <td><code>CSSRule.CHARSET_RULE</code></td> <td>{{ Anch("CSSCharsetRule") }}</td> <td> </td> </tr> <tr> <td><code>CSSRule.UNKNOWN_RULE</code></td> <td>{{ Anch("CSSUnknownRule") }}</td> <td> </td> </tr> </tbody>
</table>
<h3 name="CSSRule">CSSRule</h3>
<dl> <dt><a href="/en/DOM/cssRule.cssText" title="en/DOM/cssRule.cssText">cssText</a> </dt> <dd>Returns the textual representation of the rule, e.g. "h1,h2 { font-size: 16pt }".</dd> <dt><a href="/en/DOM/cssRule.parentRule" title="en/DOM/cssRule.parentRule">parentRule</a> </dt> <dd>Returns the containing rule, if any (e.g. a style rule inside an @media block).</dd> <dt><a href="/en/DOM/cssRule.parentStyleSheet" title="en/DOM/cssRule.parentStyleSheet">parentStyleSheet</a> </dt> <dd>Returns the <a href="/en/DOM/stylesheet" title="en/DOM/stylesheet">stylesheet</a> object that this rule is part of.</dd> <dt><a href="/en/DOM/cssRule.type" title="en/DOM/cssRule.type">type</a> </dt> <dd>The type of the rule, e.g. <code>CSSRule.CHARSET_RULE</code> or <code>CSSRule.IMPORT_RULE</code>.</dd>
</dl>
<h3 name="CSSStyleRule">CSSStyleRule</h3>
<dl> <dt><a href="/en/DOM/cssRule.selectorText" title="en/DOM/cssRule.selectorText">selectorText</a> </dt> <dd>Gets/sets the textual representation of the selector for this rule, e.g. "h1,h2".</dd> <dt><a href="/en/DOM/cssRule.style" title="en/DOM/cssRule.style">style</a> </dt> <dd>Returns the <a href="/en/DOM/CSSStyleDeclaration" title="en/DOM/CSSStyleDeclaration">CSSStyleDeclaration</a> object for the <a class="external" href="http://www.w3.org/TR/1998/REC-CSS2-19980512/syndata.html#block">declaration block</a> of the rule.</dd>
</dl><h3 name="CSSStyleRule_2">CSSMediaRule</h3>
<h3 name="CSSFontFaceRule">CSSFontFaceRule</h3>
<h3 name="CSSPageRule">CSSPageRule</h3>
<h3 name="CSSImportRule">CSSImportRule</h3>
<h3 name="CSSCharsetRule">CSSCharsetRule</h3>
<h3 name="CSSUnknownRule">CSSUnknownRule</h3>
<h3 name="Specification">Specification</h3>
<p><a class="external" href="http://www.w3.org/TR/DOM-Level-2-Style/css.html#CSS-CSSRule">DOM Level 2 CSS: CSSRule</a></p>
<p>{{ languages( { "pl": "pl/DOM/cssRule" } ) }}</p>
Revert to this revision