CSS Properties and Values API

Die CSS Properties and Values API — Teil der CSS Houdini Gruppe von APIs — ermöglicht es Entwicklern, ihre CSS benutzerdefinierten Eigenschaften explizit zu definieren, einschließlich Prüfung des Eigenschaftstyps, Standardwerten und Eigenschaften, die ihren Wert erben oder nicht.

Schnittstellen

CSS.registerProperty

Definiert, wie ein Browser CSS benutzerdefinierte Eigenschaften parsen soll. Diese Schnittstelle ist über CSS.registerProperty in JavaScript zugänglich.

@property

Definiert, wie ein Browser CSS benutzerdefinierte Eigenschaften parsen soll. Diese Schnittstelle ist über die @property at-rule in CSS zugänglich.

Beispiele

Das folgende Beispiel registriert eine benutzerdefinierte Eigenschaft namens --my-color mit CSS.registerProperty in JavaScript. --my-color verwendet die CSS-Farbsyntax, hat einen Standardwert von #c0ffee und wird seinen Wert nicht erben:

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

Die gleiche Registrierung kann in CSS unter Verwendung der @property at-rule erfolgen:

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

Spezifikationen

Specification
CSS Properties and Values API Level 1
# the-css-property-rule-interface
CSS Properties and Values API Level 1
# the-registerproperty-function

Browser-Kompatibilität

api.CSSPropertyRule

BCD tables only load in the browser

api.CSS.registerProperty_static

BCD tables only load in the browser

Siehe auch