css层叠、优先级和继承

层叠

当声明冲突时，层叠会依据三种条件解决冲突。
(1) 样式表的来源：样式是从哪里来的，包括你的样式和浏览器默认样式等。
(2) 选择器优先级：哪些选择器比另一些选择器更重要。
(3) 源码顺序：样式在样式表里的声明顺序。

选择器优先级规则

❑如果选择器的ID数量更多，则它会胜出（即它更明确）。
❑ 如果ID数量一致，那么拥有最多类的选择器胜出。
❑ 如果以上两次比较都一致，那么拥有最多标签名的选择器胜出。

伪类选择器（如：hover）和属性选择器（如[type="input"]）与一个类选择器的优先级相同。通用选择器（＊）和组合器（>、+、~）对优先级没有影响。

两条经验法则

(1) 在选择器中不要使用ID。就算只用一个ID，也会大幅提升优先级。当需要覆盖这个选择器时，通常找不到另一个有意义的ID，于是就会复制原来的选择器，然后加上另一个类，让它区别于想要覆盖的选择器。
(2) 不要使用！important。它比ID更难覆盖，一旦用了它，想要覆盖原先的声明，就需要再加上一个！important，而且依然要处理优先级的问题。

继承

如果一个元素的某个属性没有层叠值，则可能会继承某个祖先元素的值。
但不是所有的属性都能被继承。默认情况下，只有特定的一些属性能被继承，通常是我们希望被继承的那些。它们主要是跟文本相关的属性：color、font、font-family、font-size、font-weight、font-variant、font-style、line-height、letter-spacing、text-align、text-indent、text-transform、white-space以及word-spacing。还有一些其他的属性也可以被继承，比如列表属性：list-style、list-style-type、list-style-position以及list-style-image。表格的边框属性border-collapse和border-spacing也能被继承。

继承属性会顺序传递给后代元素，直到它被层叠值覆盖。

特殊值

使用inherit关键字

用inherit关键字。可以用它来覆盖另一个值，这样该元素就会继承其父元素的值。

使用initial关键字

当一个属性没有层叠值且不是继承属性时就会使用属性的初始值，当然我们也可以设置initial关键字来显式使用初始值。css每个属性都有初始值，它和浏览器相关，不同浏览器可能会有差异，但是要记住它不属于浏览器默认样式表（用户代理表）

简写属性

很多属性都可以简写，如font,background,margin,padding等。
大多数简写属性可以省略一些值，只指定我们关注的值。但是要知道，这样做仍然会设置省略的值，即它们会被隐式地设置为初始值(不是继承值)。这会默默覆盖在其他地方定义的样式。