css中这些属性有什么区别？

Question

很多样式属性都有以下的值
inherit
unset
initial
normal
auto

比如line-height,height,width...

从字面意思看都是默认值 效果上也区别不大

这些属性有什么区别呢？

Answer 1

• initial 字面意思，初始化。表示该值等于浏览器对于该属性的默认值，不同浏览器实现可能不一致（所有才有了 normalize.css）。全版本 IE 都不支持。
• inherit 字面意思，继承。表示该值等于父元素对应属性的值，不论属性本身是否是可继承属性。IE8 以前不支持。
• unset 字面意思，不设置。这个稍微有点儿复杂。如果这个属性是可继承属性（如 font-size），那么等效于 inherit；如果这个属性是不可继承属性（如 margin），那么等效于 initial。全版本 IE 都不支持。

以上三个并不是一个确切的属性值，只是代表一个替换关系，你可以理解为是个变量。

---

• normal 字面意思，普通。这个值不是所有的属性都有的，只有 white-space、font-weight、font-variant 等为数不多的几个属性可以设置。对于不同属性的具体表现可以看 MDN。
• auto 字面意思，自动。也不是所有的属性都有的，只有 margin、height、width、overflow 等为数不多的几个属性可以设置。表示由浏览器计算出最后的结果。对于不同属性的具体表现可以看 MDN。

注：上面举例的几个属性是我凭记忆写出的，可能有遗漏。