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:
- Berechnungsflag
-
Wird gesetzt, wenn das
CSSStyleDeclaration
-Objekt ein berechneter und nicht spezifizierter Stil ist. Standardmäßig nicht gesetzt. - Deklarationen
-
Die mit diesem Objekt verbundenen CSS-Deklarationen.
- Übergeordnete CSS-Regel
-
Die
CSSRule
, mit der der CSS-Deklarationsblock verbunden ist, andernfalls null. - Eigentümerknoten
-
Das
Element
, mit dem der CSS-Deklarationsblock verbunden ist, andernfalls null. - Aktualisierungsflag
-
Wird gesetzt, wenn der CSS-Deklarationsblock das
style
-Attribut des Eigentümerknotens aktualisiert.
Wenn eine CSSStyleDeclaration
von einer CSS Object Model (CSSOM)-Schnittstelle zurückgegeben wird, sind diese Eigenschaften auf die entsprechenden Werte gesetzt, wie in der Spezifikation definiert.
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 repräsentiert, 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 |