CSS 属性和值 API

CSS 属性和值 API — 作为 CSS Houdini API 集的一部分 — 允许开发者显式定义他们的 CSS 自定义属性，从而实现属性类型检查、默认值以及可以继承或不能继承其值的属性。

接口

CSS.registerProperty: 定义浏览器如何解析 CSS 自定义属性。通过 CSS.registerProperty 在 JavaScript 中访问此接口。
@property: 定义浏览器如何解析 CSS 自定义属性。通过 @property at-rule 在 CSS 中访问此接口。

以下代码将使用 CSS.registerProperty 在 JavaScript 中注册名为 --my-color 的自定义属性。--my-color 将使用 CSS 颜色语法，其默认值为 #c0ffee，并且不会继承其值。

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

相同的注册可以在 CSS 中使用 @property at-rule 完成。

css

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

规范
CSS 属性和值 API 级别 1 # the-css-property-rule-interface
CSS 属性和值 API 级别 1 # the-registerproperty-function