CSS层叠性详解

选中目标标签

第一步：
基础选择器比较方法
根据选择范围，范围越大权重越小，* < 标签选择器 < 类选择器 <id选择器
高级选择器比较方法
依次比较id选择器个数，类的个数，标签的个数，前面能比出大小就不用再比后面
第二步
如果权重相等，则后写的层叠先写的

选中目标标签祖先级

如果选择器选中的是祖先元素，文字的样式可以被继承。
第一步：
比较就近原则，比较选择器选中的祖先级在 HTML 结构中距离目标标签的
远近，近的层叠远的。
第二步：
如果选中的祖先级距离目标一样近（同一个祖先级），比较选择器权重，
权重大的层叠小的。
第三步：
如果距离一样近，权重也相同，最后比较 CSS 中的书写顺序，后面的层
叠前面的

!important关键字

如果在比较选择器权重的过程中，遇见一个 !important 关键字，可以将某条 CSS
样式属性的权重提升到最大。

行内式权重

行内式样式与内嵌式或外链式样式比较权重时，行内式的权重最高。
但是，与 !important 关键字相比权重要低。