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
アットルールを使用するときには必要であり、 @property
で指定されたカスタムプロパティの登録を既定で継承するかどうかを制御します。
構文
css
@property --property-name {
syntax: "<color>";
inherits: false;
initial-value: #c0ffee;
}
@property --property-name {
syntax: "<color>";
inherits: true;
initial-value: #c0ffee;
}
値
公式定義
形式文法
inherits =
true |
false
例
--my-color
カスタムプロパティ
に色としての型チェックと、既定値、そして値が継承されないことを追加します。
CSS の @property
アットルールを使用すると次のようになります。
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 |
ブラウザーの互換性
BCD tables only load in the browser