inherits

Baseline 2024
Newly available

Since July 2024, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.

Der inherits CSS-Deskriptor der @property at-rule steuert, ob die registrierte CSS Custom Property standardmäßig vererbt wird oder nicht. Es ist ein erforderlicher Deskriptor; fehlt er oder ist er ungültig, ist die gesamte @property-Regel ungültig und wird ignoriert.

Syntax

css
/* Custom property does not inherit values */
inherits: false;

/* Custom property inherits values */
inherits: true;

Werte

true

Die Eigenschaft wird standardmäßig vererbt.

false

Die Eigenschaft wird standardmäßig nicht vererbt.

Formale Definition

Zugehörige @-Regel@property
Anfangswertauto
Berechneter Wertwie angegeben

Formale Syntax

inherits = 
  true   |
  false

Beispiele

Einstellen des Verhaltens der Vererbung einer benutzerdefinierten Eigenschaft

Dieses Beispiel zeigt, wie eine benutzerdefinierte Eigenschaft --my-color definiert wird, die ihren Wert nicht von ihren Elternelementen erbt:

css
@property --my-color {
  syntax: "<color>";
  inherits: false;
  initial-value: #c0ffee;
}

Verwendung von JavaScript CSS.registerProperty():

js
window.CSS.registerProperty({
  name: "--my-color",
  syntax: "<color>",
  inherits: false,
  initialValue: "#c0ffee",
});

Spezifikationen

Specification
CSS Properties and Values API Level 1
# inherits-descriptor

Browser-Kompatibilität

BCD tables only load in the browser

Siehe auch