CSS层叠（Cascading）是指一个元素会根据样式规则的优先级来设置元素的外观。级联样式的优先级主要有三个方面：从样式字段来看，是用户代理样式表（useragentstylesheet）还是自己写的样式；是否有！在样式属性中；根据选择器判断。什么是用户代理风格？基本上所有的浏览器都有默认的样式，比如

-

，

标签都有默认的上下边距，这是浏览器默认设置的，所以称为用户代理样式。如果一个元素有很多相同的样式规则，应该应用哪一个？首先浏览器会先判断当前的样式是useragent样式还是自己写的样式。两者之中，我们自己写的样式优先级更高，所以如果同一个元素上存在相同的样式规则，我们自己写的会覆盖浏览器默认的样式；然后，判断当前样式规则是否存在！important标志，如果存在，则表示其优先级高，则应用该样式；其次，判断当前样式规则是否为内联样式，如果是内联样式，优先级高于其他样式（但有!important标识的除外）；然后，根据选择器的优先级，选择器的优先级从大到小依次为：ID选择器、类选择器、属性选择器、伪元素选择器、标签选择器；最后根据选择器个数判断，如果ID选择器个数相同，则判断类选择器个数，如果都相同，则判断Attributes，伪类元素个数，如果最后优先级相同，按照代码顺序，后者优先，后者覆盖前者。以下是样式级联的规则，按优先级从高到低排列：是否为内联样式，并带有!important标志；它是否有!important标志；是否有ID选择器；是否有类选择器；是否有属性，伪元素选择器；是否有标签选择器；是否有通配符选择器；用户代理样式；继承的风格。继承（Inheritance）继承是指元素可以将祖先元素的样式继承给自己，但并不是所有的样式都可以继承。几乎所有的样式属性都可以继承属性值为inherit的祖先元素的样式。文本可以继承的样式这些文本属性可以被继承：颜色、字体、字体大小、字体粗细、字体变体、字体样式、字体系列、行高、字间距、空白、字母-间距，文本转换，文本缩进，文本对齐。其他可继承的样式列表元素的一些样式可以通过继承来实现：list-style、list-style-type、list-style-position、list-style-image。表格元素的边框属性：border-collapse、border-spacing。Tips：平时我们在开发的时候，最好少用！重要的logo和ID选择器。他们应该有很高的优先级。如果后面我们要覆盖它们的样式，就必须继续用同样的方法添加!important或者ID。意识到，这种做法不利于维护。我们可以通过类选择器和样式级联规则来覆盖它。参考：《CSS in Depth》byKeithJ.Grant