unset
CSS 关键字 unset
可以分为两种情况,如果这个属性本来有从父级继承的值(这个属性默认可以继承,且父级有定义),则将该属性重新设置为继承的值,如果没有继承父级样式,则将该属性重新设置为初始值。换句话说,在第一种情况下(继承属性)它的行为类似于inherit
,在第二种情况下(非继承属性)类似于initial
。它可以应用于任何 CSS 属性,包括 CSS 简写属性 all
。
示例
Color
HTML
<p>This text is red.</p>
<div class="foo">
<p>This text is also red.</p>
</div>
<div class="bar">
<p>This text is green (default inherited value).</p>
</div>
CSS
.foo {
color: blue;
}
.bar {
color: green;
}
p {
color: red;
}
.bar p {
color: unset;
}
结果
Border
HTML
<p>This text has a red border.</p>
<div>
<p>This text has a red border.</p>
</div>
<div class="bar">
<p>This text has has a black border (initial default, not inherited).</p>
</div>
CSS
div {
border: 1px solid green;
}
p {
border: 1px solid red;
}
.bar p {
border-color: unset;
}
结果
规范
规范 | 版本 | 评论 |
---|---|---|
CSS Cascading and Inheritance Level 4 unset |
Candidate Recommendation | 与 Level 3 无变化 |
CSS Cascading and Inheritance Level 3 unset |
Recommendation | 初始规范 |
浏览器兼容性
BCD tables only load in the browser
参见
- 使用
initial
将属性设置为其初始值。 - 使用
revert
(en-US)将属性重置为 user-agent 样式表规定的值(或用户样式,如果存在)。 - 使用
inherit
使元素的属性与其父元素相同。 -
all
属性允许您一次将所有属性重置为其初始,继承,恢复或未设置状态。