CSSLayerBlockRule
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2022.
TheCSSLayerBlockRule represents a@layer block rule.
Instance properties
Inherits properties from its ancestorsCSSGroupingRule andCSSRule.
CSSLayerBlockRule.nameRead onlyA string containing the name of the associated cascade layer.
Instance methods
Inherits methods from its ancestorsCSSGroupingRule andCSSRule.
Examples
HTML
html
<p>I am displayed in <code>color: rebeccapurple</code>.</p>CSS
css
@layer special { p { color: rebeccapurple; }}JavaScript
js
const item = document.getElementsByTagName("p")[0];const rules = document.getElementById("css-output").sheet.cssRules;const layer = rules[0]; // A CSSLayerBlockRuleitem.textContent = `The CSSLayerBlockRule is for the "${layer.name}" layer`;Result
Specifications
| Specification |
|---|
| CSS Cascading and Inheritance Level 5 # csslayerblockrule |