CSSImportRule
Baseline
Widely available
*
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
* Some parts of this feature may have varying levels of support.
Instance properties
Inherits properties from its ancestor CSSRule.
CSSImportRule.hrefRead only-
Returns the URL specified by the
@importrule. CSSImportRule.layerNameRead only-
Returns the name of the cascade layer declared in the
@importrule, the empty string if the layer is anonymous, the ornullif the rule doesn't declare any. CSSImportRule.media-
Returns the value of the
mediaattribute of the associated stylesheet. CSSImportRule.styleSheetRead only-
Returns the associated stylesheet.
CSSImportRule.supportsTextRead only-
Returns the supports condition specified by the
@importrule.
Instance methods
Inherits methods from its ancestor CSSRule.
Examples
The document includes a single stylesheet which contains a single @import rule. Therefore the first item in the list of CSS rules will be a CSSImportRule.
css
@import "style.css" screen;
js
const myRules = document.styleSheets[0].cssRules;
console.log(myRules[0]); // A CSSImportRule instance object
Specifications
| Specification |
|---|
| CSS Object Model (CSSOM) # the-cssimportrule-interface |
Browser compatibility
| desktop | mobile | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
CSSImportRule
|
|
|
|
|
|
|
|
|
|
|
|
|
href
|
|
|
|
|
|
|
|
|
|
|
|
|
layerName
|
|
|
|
|
|
|
|
|
|
|
|
|
media
|
|
|
|
|
|
|
|
|
|
|
|
|
styleSheet
|
|
|
|
|
|
|
|
|
|
|
|
|
supportsText
|
|
|
|
|
|
|
|
|
|
|
|
|
Legend
Tip: you can click/tap on a cell for more information.
- Full support
- Full support