CSS-Deklarationsblock
Ein CSS-Deklarationsblock ist eine geordnete Sammlung von CSS-Eigenschaften und -Werten. Im DOM wird er als CSSStyleDeclaration dargestellt.
Jedes Paar aus Eigenschaft und Wert wird als CSS-Deklaration bezeichnet. Der CSS-Deklarationsblock hat die folgenden zugehörigen Eigenschaften:
- berechnete Flagge
-
Wird gesetzt, wenn das
CSSStyleDeclaration-Objekt einen berechneten anstelle eines angegebenen Stils darstellt. Standardmäßig nicht gesetzt. - Deklarationen
-
Die CSS-Deklarationen, die mit diesem Objekt verbunden sind.
- übergeordnete CSS-Regel
-
Die
CSSRule, mit der der CSS-Deklarationsblock verknüpft ist, andernfalls null. - Eigentümerknoten
-
Das
element, mit dem der CSS-Deklarationsblock verknüpft ist, andernfalls null. - Aktualisierungsflagge
-
Wird gesetzt, wenn der CSS-Deklarationsblock das
style-Attribut des Eigentümerknotens aktualisiert.
Wenn eine CSSStyleDeclaration von einer Schnittstelle des CSS Object Model (CSSOM) zurückgegeben wird, werden diese Eigenschaften gemäß der Spezifikation auf die entsprechenden Werte gesetzt.
Einfaches Beispiel
Das folgende Beispiel zeigt eine CSS-Regel mit einem Deklarationsblock für das h1-Element. Der CSS-Deklarationsblock sind die Zeilen zwischen den geschweiften Klammern.
h1 {
margin: 0 auto;
font-family: "Helvetica Neue", "Arial", sans-serif;
font-style: italic;
color: rebeccapurple;
}
Wir können eine CSSStyleDeclaration zurückgeben, die diesen CSS-Deklarationsblock darstellt, indem wir CSSStyleRule.style verwenden.
let myRules = document.styleSheets[0].cssRules;
let rule = myRules[0]; // a CSSStyleRule
console.log(rule.style); // a CSSStyleDeclaration object
Spezifikationen
| Specification |
|---|
| CSS Object Model (CSSOM) # css-declaration-blocks |