一个简单的例子：
HTML
<p style="color:red!important">
this text is red
<em>
this text is in the initial color (e.g. black)
</em>
this is red again
</p>
CSS
em {
color:initial;
color:unset;
}
初始和未设置之间有什么区别？仅支持浏览器
解决方法
将我的评论移至答案
根据your link：
unsetis a CSS value that’s the same as “inherit” if a property is inherited or “initial” if a property is not inherited
这是一个例子：
pre {
color: #f00;
}
.initial {
color: initial;
}
.unset {
color: unset;
}
<pre> <span>This text is red because it is inherited.</span> <span class="initial">[color: initial]: This text is the initial color (black,the browser default).</span> <span class="unset">[color: unset]: This text is red because it is unset (which means that it is the same as inherited).</span> </pre>
如果您尝试覆盖样式表中的某些CSS，则差异很重要的情况，但您希望继承该值而不是设置回浏览器默认值。
例如：
pre {
color: #00f;
}
span {
color: #f00;
}
.unset {
color: unset;
}
.initial {
color: initial;
}
<pre> <em>Text in this 'pre' element is blue.</em> <span>The span elements are red,but we want to override this.</span> <span class="unset">[color: unset]: This span's color is unset (blue,because it is inherited from the pre).</span> <span class="initial">[color: initial]: This span's color is initial (black,the browser default).</span> </pre>
