CSSLayerBlockRule

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2022年3月.

CSSLayerBlockRule は@layer ブロックルールを表します。

インスタンスプロパティ

祖先であるCSSGroupingRule およびCSSRule から継承したプロパティもあります。

CSSLayerBlockRule.name読取専用
- 関連するカスケードレイヤーの名前を含む文字列です。

インスタンスメソッド

祖先であるCSSGroupingRule およびCSSRule から継承したメソッドもあります。

例

HTML

html

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

CSS

css

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

JavaScript

const item = document.getElementsByTagName("p")[0];const rules = document.styleSheets[1].cssRules;// スタイルシート #1 はこの埋め込み例に関連するスタイルシートであり、// スタイルシート #0 は MDN ページ全体に関連するスタイルシート。const layer = rules[0]; // CSSLayerBlockRuleitem.textContent = `この CSSLayerBlockRule は "${layer.name}" レイヤーのものです。`;