首先，我们梳理一下哪些属性会被继承
-
文本
-
- color 颜色，a元素除外
- direction 方向
- font 字体
- font-family 字体系列
- font-style 字体风格
- font-size 字体大小
- 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-siede 指定表格标题的位置
- empty-cells 指定是否显示i表格中的空单元格
-
页面设置
- orphans 指定当元素内部发生分页时在页面底部需要保留的最小行数
- page-break-inside 设置元素内部的分页形式
- windows 设置当元素内部发生分页是在页面顶部需要保留的最少行数
-
其他
- cursor 鼠标指针
- quotes 指定引号样式
然后我们讨论一下，当规则发生冲突时：如何处理‘层叠’问题
-
先考虑选择器优先级
- 标签选择器1
- 类选择器10
- id选择器100
- 复合选择器以最后的部分为主
-
再寻找是否存在'! important'
如果为了避免其他属性的覆盖和影响，可以声明一条特殊的规则来覆盖一切，具体方法是这样的：如 p{ color：orange !important;}这样 这个属性将凌驾于一切而在页面上显示出来。