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.

css
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.

js
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