层叠规则

样式计算分为四个步骤：

声明查看默认样式表或者作者样式表中是否声明了样式
层叠：解决样式冲突(优先级、特殊性、源次序)

举例：

  #nav a.link{
        color: blue;
        background-color: red;
      }
  #nav a.link.active{
        color: green;
      }
//这里，color就会导致冲突。而background-color不会引起冲突

优先级：作者样式表!important>默认样式表!important>作者样式表>默认样式表 (user agent stylesheet就是默认样式表)

特殊性：有四个数字(?,?,?,?)

第一个数字：如果有内联样式style，那么第一个数字为1 优先级最高 ，不需要管其他类选择id选择器的冲突样式

第二个数字：ID选择器的数量

第三个数字： 类选择器、属性选择器、伪类选择器的总数量。

有一个id选择器，有一个类选择器.link 一个属性选择器[href] 一个伪类选择器。一个元素选择器a

第四个数字：元素选择器和伪元素选择器的数量

继承

继承是有前提条件的，首先是没有声明样式值，其次样式是可以继承的。

inherit 作用：将父元素的对应样式，复制粘贴到对应位置。它并不是继承，只是复制样式，发生在层叠区间。

  .father {
                color: red;
            }
            .son {
                color: inherit; /* 等同于color:red */
            }

默认

所以，开发者只能修改第一、第二步，对于继承和默认是无法直接修改的，只能间接影响

CSS层叠规则(不要再相信权重了)

层叠规则