CSS称为层叠样式表，层叠是对CSS规则冲突的解决方式，主要包含
- 样式表的来源
- 选择器优先级
- 源码顺序
样式表的来源
样式表的来源主要有三种：
- 用户代理样式表，即浏览器默认样式
- 作者样式表，即网站作者定义的样式
- 用户样式表，有些浏览器允许用户添加自定义样式，少见
总结：优先级 用户样式表 > 作者样式表 > 用户代理样式表
此处需要注意： <!DOCTYPE html> 声明。如果 HTML 文件的开头没有添加该声明，浏览器就会使用怪异模式（Quirks Mode），怪异模式下用户代理样式表会与标准模式有所不同，比如 table 的用户代理样式表：
怪异模式：
标准模式：
怪异模式的具体内容可参考：quirks.spec.whatwg.org
所以最好在 HTML 文件的开头声明 <!DOCTYPE html>
选择器优先级
CSS选择器有多种，不同的选择器也会有不同的优先级，常用的选择器包含ID选择器、类选择器、元素选择器、伪类选择器、伪元素选择器、属性选择器、通用选择器（*）和组合器（> + ~）
这些选择器的优先级规则是怎样的？
首先看类型：
ID选择器 > 类选择器 （伪类选择器、属性选择器）> 元素选择器
注意：通用选择器、组合器对优先级没有影响
然后看数量：
- ID选择器数量越多，优先级会更高
- ID选择器数量相同，类选择器数量越多，优先级会更高
- ID选择器和类选择器数量相同，元素选择器数量越多，优先级会更高
同时不要忘记内联样式，内联样式是写在HTML标签上的属性，他的优先级也是最高的（在没有使用!important标记的情况下），所以有内联样式，会最优先使用内联样式
源码顺序
最后解决冲突的方式是源码的顺序，如果两个冲突的选择器优先级相同，则比较靠后的选择器会覆盖靠前的选择
总结：优先级 选择器优先级相同的情况下，靠后的代码 > 靠前的代码
!important
使用 !important的 CSS 样式是特殊的，它拥有最高的优先级，规则如下：
- 当在不同地方声明的CSS属性具有相同的优先级时，使用
!important标记的属性会被应用 - 内联样式与样式表声明了相同的属性，样式表中的属性标记了
!important，则样式表中的属性会被应用 - 在不同地方声明的属性都标记了
!important，则会根据以上描述的内联样式 > 选择器优先级 > 源码先后顺序 的规则，确定哪个声明会被应用
总之，!important标记的属性具有最高优先级
