CSS权重优先级的认知


从CSS代码存放位置看权重优先级:内嵌样式 > 内部样式表 > 外联样式表。其实这个基本可以忽视之,大部分情况下CSS代码都是使用外联样式表。

从样式选择器看权重优先级:important > 内嵌样式 > ID > 类 > 标签 | 伪类 | 属性选择 > 伪对象 > 继承 > 通配符。

    • important的权重为1,0,0,0
    • ID的权重为0,1,0,0
    • 类的权重为0,0,1,0
    • 标签的权重为0,0,0,1
    • 伪类的权重为0,0,1,0
    • 属性的权重为0,0,1,0
    • 伪对象的权重为0,0,0,1
    • 通配符的权重为0,0,0,0 

实例:
 
    这到底是什么颜色啊?


先自己想想是什么颜色,再往下看













2个#left的权重都是1,1,0,0 这个时候就采用最后定义原则,所以最后输出的姿态是绿色的。 
#container #left{color:red;}         /*0,2,0,0*/ 这里虽然第二位有个2,但是没用,第一位是0,你后面是多少都没用
 
CSS