此页面由社区从英文翻译而来。了解更多并加入 MDN Web Docs 社区。

View in English Always switch to English

CSSLayerBlockRule:name 属性

基线 广泛可用

自 2022年3月 起,此特性已在主流浏览器中得到支持,可在大多数设备和浏览器版本中正常使用。

CSSLayerBlockRule 接口的只读属性 name 表示关联的层叠层的名称。

包含层名称的字符串,如果层是匿名的,则为 ""

示例

HTML

html
<output></output> <output></output>

CSS

css
output {
  display: block;
}

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

@layer {
  div {
    color: black;
  }
}

JavaScript

js
const item1 = document.getElementsByTagName("output")[0];
const item2 = document.getElementsByTagName("output")[1];
const rules = document.styleSheets[1].cssRules;
// 注意,样式表 #1 是与此嵌入示例相关联的样式表,
// 而样式表 #0 是与整个 MDN 页面相关联的样式表

const layer = rules[1]; // CSSLayerBlockRule
const anonymous = rules[2]; // 匿名的 CSSLayerBlockRule

item1.textContent = `第一个 CSSLayerBlockRule 定义了“${layer.name}”层。`;
item2.textContent = `第二个 CSSLayerBlockRule 定义了一个层,其名称为:“${anonymous.name}”。`;

结果

规范

规范
CSS Cascading and Inheritance Level 5
# dom-csslayerblockrule-name

浏览器兼容性

参见