`initial-value`

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 initial-value Deskriptor der @property At-Regel gibt den Anfangswert für die registrierte CSS-Custom-Property an. Es ist ein erforderlicher Deskriptor, es sei denn, der Wert des syntax Deskriptors ist die universelle Syntax (*). Wenn er erforderlich ist, aber fehlt oder ungültig ist, ist die gesamte @property-Regel ungültig und wird ignoriert.

Syntax

css
/* Set initial color value */
initial-value: rebeccapurple;

/* Set initial length value */
initial-value: 2rem;

Werte

Ein Wert, der dem Typ entspricht, der im syntax Deskriptor angegeben ist. Wenn Syntax zum Beispiel <color> ist, dann muss der initial-value ein gültiger color-Wert sein.

Formale Definition

Zugehörige @-Regel@property
Anfangswertn/a (required)
Berechneter Wertwie angegeben

Formale Syntax

initial-value = 
  <declaration-value>?

Beispiele

Einen Anfangswert für eine benutzerdefinierte Eigenschaft festlegen

Dieses Beispiel zeigt, wie man eine benutzerdefinierte Eigenschaft --my-color mit einem anfänglichen Farbwert von #c0ffee definiert. Dieser Anfangswert wird verwendet, wenn die Eigenschaft nicht vererbt wird (inherits: false) und kein anderer Wert auf dem Element gesetzt ist.

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
# initial-value-descriptor

Browser-Kompatibilität

Siehe auch