CSSLayerBlockRule

The CSSLayerBlockRule represents a @layer block rule.

Instance properties

Inherits properties from its ancestors CSSGroupingRule and CSSRule.

• name Read only
  • : A string containing the name of the associated cascade layer.

Instance methods

Inherits methods from its ancestors CSSGroupingRule and CSSRule.

Examples

HTML

<p>I am displayed in <code>color: rebeccapurple</code>.</p>

CSS

@layer special {
  p {
    color: rebeccapurple;
  }
}

JavaScript

const item = document.getElementsByTagName("p")[0];
const rules = document.getElementById("css-output").sheet.cssRules;

const layer = rules[0]; // A CSSLayerBlockRule

item.textContent = `The CSSLayerBlockRule is for the "${layer.name}" layer`;

Result

Specifications

Browser compatibility

See also

• @layer
• CSSLayerStatementRule
• Learn CSS cascade layers