Derinitial-value Deskriptor der@propertyAt-Regel gibt den Anfangswert für die registrierteCSS benutzerdefinierte Eigenschaft an. Es ist ein erforderlicher Deskriptor, es sei denn, der Wert dessyntax Deskriptors ist die universelle Syntax (*). Wenn erforderlich, aber fehlend oder ungültig, ist die gesamte@property-Regel ungültig und wird ignoriert.

Syntax

/* Set initial color value */initial-value: rebeccapurple;/* Set initial length value */initial-value: 16px;

Werte

Ein Wert, der dem imsyntax Deskriptor angegebenen Typ entspricht. Zum Beispiel, wennsyntax<color> ist, muss derinitial-value ein gültigercolor-Wert sein.

Wenn der Wert dessyntax Deskriptors nicht die universelle Syntaxdefinition ist, muss derinitial-value Deskriptor einenberechnungsunabhängigen Wert haben. Das bedeutet, der Wert kann in einen berechneten Wert umgewandelt werden, ohne von anderen Werten abhängig zu sein, außer von "globalen" Definitionen, die unabhängig von CSS sind. Zum Beispiel ist10px berechnungsunabhängig — es ändert sich nicht, wenn es in einen berechneten Wert umgewandelt wird.2in ist ebenfalls gültig, da1in immer96px entspricht.3em ist jedoch nicht gültig, da der Wert einesem von derfont-size des Elternteils abhängig ist.

Formale Definition

Formale Syntax

initial-value =
<declaration-value>?

Beispiele

Setzen eines Anfangswerts für eine benutzerdefinierte Eigenschaft

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

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

Verwendung vonJavaScriptCSS.registerProperty():

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

Spezifikationen

Browser-Kompatibilität

Siehe auch

• Andere@property Deskriptoren:inherits undsyntax
• Registrieren von CSS benutzerdefinierten Eigenschaften
• CSS Properties and Values API
• CSS Painting API
• CSS Typed Object Model
• Houdini APIs