CSSRule: parentRule property
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.
The parentRule read-only property of the CSSRule interface returns the containing rule of the current rule if this exists, or otherwise returns null.
Value
A CSSRule which is the type of the containing rules. If the current rule is inside a media query, this would return CSSMediaRule. Otherwise it returns null.
Examples
css
@media (width >= 500px) {
.box {
width: 100px;
height: 200px;
background-color: red;
}
body {
color: blue;
}
}
js
let myRules = document.styleSheets[0].cssRules;
let childRules = myRules[0].cssRules;
console.log(childRules[0].parentRule); // a CSSMediaRule
Specifications
| Specification |
|---|
| CSS Object Model (CSSOM) # dom-cssrule-parentrule |