CSSScopeRule
Baseline
2025
Newly available
Since December 2025, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.
The CSSScopeRule interface of the CSS Object Model represents a CSS @scope at-rule.
Instance properties
Inherits properties from its ancestors CSSGroupingRule and CSSRule.
Instance methods
Inherits methods from its ancestors CSSGroupingRule and CSSRule.
Examples
Accessing @scope information in JavaScript
Assuming the following is the only stylesheet attached to a document:
css
@scope (.outer) to (.inner) {
:scope {
background: yellow;
}
}
The following JavaScript could be used to access information about the contained @scope block:
js
const scopeBlock = document.styleSheets[0].cssRules[0];
console.log(scopeBlock.start); // Returns ".outer"
console.log(scopeBlock.end); // Returns ".inner"
Specifications
| Specification |
|---|
| CSS Cascading and Inheritance Level 6 # cssscoperule |