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.

inherits CSS 描述符是在使用 @property At 规则时所必须的,它控制着由 @property 指定的自定义属性注册是否默认继承。

语法

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

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

true

该属性默认继承。

false

该属性默认不继承。

形式定义

Related at-rule@property
初始值auto
计算值as specified

形式语法

inherits = 
true |
false

示例

--my-color 自定义属性添加类型检查,将其限定为颜色类型,并设置默认值,同时禁止其继承值。

使用 CSS @property At 规则

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

使用 JavaScript CSS.registerProperty()

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

规范

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

浏览器兼容性

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
inherits descriptor

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support

参见