Baseline Widely available *
The CSSStyleSheet
interface represents a single CSS stylesheet, and lets you inspect and modify the list of rules contained in the stylesheet. It inherits properties and methods from its parent, StyleSheet
.
A stylesheet consists of a collection of CSSRule
objects representing each of the rules in the stylesheet. The rules are contained in a CSSRuleList
, which can be obtained from the stylesheet's cssRules
property.
For example, one rule might be a CSSStyleRule
object containing a style such as:
h1,
h2 {
font-size: 16pt;
}
Another rule might be an at-rule such as @import
or @media
, and so forth.
See the Obtaining a StyleSheet section for the various ways a CSSStyleSheet
object can be obtained. A CSSStyleSheet
object can also be directly constructed. The constructor, and the CSSStyleSheet.replace()
, and CSSStyleSheet.replaceSync()
methods are newer additions to the specification, enabling Constructable Stylesheets.
CSSStyleSheet()
Creates a new CSSStyleSheet
object.
Inherits properties from its parent, StyleSheet
.
CSSStyleSheet.cssRules
Read only
Returns a live CSSRuleList
which maintains an up-to-date list of the CSSRule
objects that comprise the stylesheet.
Note: In some browsers, if a stylesheet is loaded from a different domain, accessing cssRules
results in a SecurityError
.
CSSStyleSheet.ownerRule
Read only
If this stylesheet is imported into the document using an @import
rule, the ownerRule
property returns the corresponding CSSImportRule
; otherwise, this property's value is null
.
Inherits methods from its parent, StyleSheet
.
CSSStyleSheet.deleteRule()
Deletes the rule at the specified index into the stylesheet's rule list.
CSSStyleSheet.insertRule()
Inserts a new rule at the specified position in the stylesheet, given the textual representation of the rule.
CSSStyleSheet.replace()
Asynchronously replaces the content of the stylesheet and returns a Promise
that resolves with the updated CSSStyleSheet
.
CSSStyleSheet.replaceSync()
Synchronously replaces the content of the stylesheet.
These properties are legacy properties as introduced by Microsoft; these are maintained for compatibility with existing sites.
rules
Read only Deprecated
The rules
property is functionally identical to the standard cssRules
property; it returns a live CSSRuleList
which maintains an up-to-date list of all of the rules in the style sheet.
These methods are legacy methods as introduced by Microsoft; these are maintained for compatibility with existing sites.
addRule()
Deprecated
Adds a new rule to the stylesheet given the selector to which the style applies and the style block to apply to the matching elements.
This differs from insertRule()
, which takes the textual representation of the entire rule as a single string.
removeRule()
Deprecated
Functionally identical to deleteRule()
; removes the rule at the specified index from the stylesheet's rule list.
A stylesheet is associated with at most one Document
, which it applies to (unless disabled). A list of CSSStyleSheet
objects for a given document can be obtained using the Document.styleSheets
property. A specific style sheet can also be accessed from its owner object (Node
or CSSImportRule
), if any.
A CSSStyleSheet
object is created and inserted into the document's Document.styleSheets
list automatically by the browser, when a stylesheet is loaded for a document.
A (possibly incomplete) list of ways a stylesheet can be associated with a document follows:
Specifications Browser compatibility See alsoRetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4