说明

web开发者编写的样式规则与浏览器的默认规则冲突时，均以开发者编写的样式为准

CSS层叠原则

1. 特殊性

• 特殊性规则指定选择亲的具体程度；选择器越特殊，规则就越强；遇到冲突时，优先应用特殊性强的原则

2. 顺序

• CSS样式表中晚出现的优先级更高
• 直接应用在HMTL元素上的规则(不推荐使用该做法)被认为比外联样式表中或插在HTML文档顶部的特殊性相同的规则出现的更晚，因此优先级更高

3. 重要性

• 当以上规则无法满足需要时，可以在某一条规则末尾加上"!important"
• Eg

css
p {
    color: red !important;
}

注意其添加前有空格，且后加分号

4. 补充
   建议在样式表中多使用类选择器，避免使用ID选择器

理解继承

继承

当对某个元素应用CSS属性时，这些属性不仅会影响该元素，还会影响其下的分支元素。即这些下层的元素继承了其祖先元素的属性

作用

继承可以简化CSS样式表

可被继承的属性

文本

属性	说明
color	颜色，a元素除外
directon	方向
font	字体
font-fanily	字体系列
font-size	字体大小
font-style	用于设置斜体
font-variant	用于设置小型大写字母
font-weight	用于设置粗体
letter-spacing	字母间距
line-height	行高
text-align	用于设置对齐方式
text-indent	用于设置首行缩进
text-transform	用于修改大小写
visibility	可见性
white-space	用于指定如何处理空格
word-spacing	字间距

列表

属性	说明
list-style	列表样式
list-style-image	用于为列表指定定制的标记
list-style-position	用于确定列表标记的位置
list-style-type	用于设置列表的标记

表格

属性	说明
border-collapse	用于控制表格相邻单元格的边框是否合并为单一边框
border-spacing	用于指定表格边框之间的空隙大小
caption-side	用于设置表格标题的位置
empty-cells	用于设置是否显示表格中的空单元格

页面设置(对于印刷物)

属性	说明
orphans	用于设置当元素内部发生分页时在页面底部需要保留的最少行数
page-break-inside	用于设置元素内部的分页方式
widows	用于设置当元素内部发生分页时在页面顶部需要保留的最少行数

注意

1. 继承不具有任何特殊性，而通配符的特殊性为0，需要注意是否被覆盖
2. a标签自身设置了颜色，h标签自身设置了字号。因此，继承的颜色、字号将被覆盖