unset

The unset CSS keyword is the combination of the initial and inherit keywords. Like these two other CSS-wide keywords, it can be applied to any CSS property, including the CSS shorthand all. This keyword resets the property to its inherited value if it inherits from its parent or to its initial value if not. In other words, it behaves like the inherit keyword in the first case and like the initial keyword in the second case.

CSS 关键字 unset 是 关键字 initial 和 inherit的组合。像这两个关键字一样，它允许应用任意的CSS样式，包括CSS速记 all 关键字。如果有继承父级样式，则将该属性重新设置为继承的值，如果没有继承父级样式，则将该属性重新设置为初始值。换句话说这个unset关键字会优先用inherit的样式，其次会应该用initial的样式。

Examples

Color

.foo {
  color: blue;
}
.bar {
  color: green;
}

p {
  color: red;
}
.bar p {
  color: unset;
}

<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>

Result:

Border

div {
	border: 1px solid green;
}

p {
  border: 1px solid red;
}

.bar p {
	border-color: unset;
}

<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>

结果：

格式

浏览器兼容性

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!

参见

CSS的属性值： initial, inherit, unset, and revert.