了解下 CSS 中的 inherit、initial、unset 和 revert 的作用
CSS 的属性从继承的角度看,可以分为继承类型(Inherited properties)和非继承类型(Non-inherited properties),两个类型的属性初始值是不一样的,对于继承类型的属性来说,默认值是 inherit
;非继承类型的属性的默认值则是 initial
。
当我们在开发中想要取消某个样式属性的时候,可以将该属性设回默认值。而且我们大可不必死记硬背哪些属性是继承属性,要改成 inherit
,哪些是非继承属性又要改成 initial
,只要将属性设置为 unset
,样式解析器会自己进行判断。
但是,unset
不适用于 display
属性。display
属于非继承属性,因此 unset
会将它设置成 initial
,但是 display
的 initial
属性值是 inline,这点和我们的预期不符。所以对于 display
,我们要将它设置为 revert
这个属性值。
以上内容提取自《An Interview With Elad Shechter on "The New CSS Reset"》,在这篇采访稿里有对上面内容更深的解释,推荐阅读。