CSS的继承性和层叠性

继承性

CSS的一个主要特征就是继承，它是依赖于祖先-后代的关系的。继承是一种机制，它允许样式不仅可以应用于某个特定的元素，还可以应用于它的后代。

哪些属性能继承？color、 text-开头的、line-开头的、font-开头的。
这些关于文字样式的，都能够继承； 所有关于盒子的、定位的、布局的属性都不能继承。

层叠性

层叠性：就是CSS处理冲突的能力。 所有的权重计算，没有任何兼容问题！

当选择器，选择上了某个元素的时候，那么要这么统计权重：

id的数量，类的数量，标签的数量

    <style type="text/css">
        #box1 .box2 p { /*权重：111*/
            color: red;
        }
        div div #box3 p { /*权重：103*/
            color: blue;
        }
        div.box1 div.box2 div.box3 p { /*权重：34*/
            color: pink;
        }
    </style>

255个标签等于1个类名（可以进位，但是没有实战意义）

总结：

如果权重一样，那么以后出现选择器的为准。
如果不能直接选中某个元素，通过继承性影响的话，那么权重是0。
如果大家都是0，那么有一个就近原则：谁描述的近，听谁的。

权重问题

同一个标签，携带了多个类名，有冲突：

    <p class="spec1 spec2">我是什么颜色？</p>
    <p class="spec2 spec1">我是什么颜色？</p>

和在标签中的挂类名的书序无关，只和css的顺序有关：

    spec2{
        color:blue;
    }
    .spec1{
        color:red;
    }

所以是红色的。

!important标记

    <style type="text/css">
        p{
            color:red !important;
        }
    </style>

来给一个属性提高权重。这个属性的权重就是无穷大。

!important无法提升继承的权重，该是0还是0
!important不影响就近原则
!important做站的时候，不允许使用。因为会让css写的很乱。