CSSLayerStatementRule
Baseline
Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since März 2022.
Die CSSLayerStatementRule repräsentiert eine @layer Anweisungsregel. Im Gegensatz zu CSSLayerBlockRule enthält sie keine weiteren Regeln und definiert lediglich eine oder mehrere Ebenen, indem deren Namen angegeben werden.
Diese Regel ermöglicht es, die Reihenfolge der Ebenen explizit zu deklarieren, die zu Beginn einer CSS-Datei offensichtlich ist: Die Reihenfolge der Ebenen wird durch das erste Auftreten jedes Ebenennamens bestimmt. Durch das Deklarieren mit einer Anweisung kann der Leser die Ebenenreihenfolge verstehen. Es ermöglicht auch das Ineinanderfügen von inline und importierten Ebenen, was bei Verwendung der CSSLayerBlockRule-Syntax nicht möglich ist.
Instanzeigenschaften
Erbt auch Eigenschaften von ihrer übergeordneten Schnittstelle CSSRule.
CSSLayerStatementRule.nameListSchreibgeschützt- Ein Array von String-Elementen, das den Namen jeder Kaskadenschicht durch die Regel darstellt.
Beispiele
HTML
<p></p>
CSS
@layer layerName, layerName2;
JavaScript
const item = document.getElementsByTagName("p")[0];
const rules = document.getElementById("css-output").sheet.cssRules;
const layer = rules[0]; // A CSSLayerStatementRule
item.textContent = `The CSS @layer statement declares the following layers: ${layer.nameList.join(
", ",
)}.`;
Ergebnis
Spezifikationen
| Specification |
|---|
| CSS Cascading and Inheritance Level 5 # csslayerstatementrule |