CSS不同选择器的权重(CSS层叠的规则)

• ！important规则最重要，大于其它规则
• 行内样式规则，加1000
• 对于选择器中给定的各个ID属性值，加100
• 对于选择器中给定的各个类属性、属性选择器或者伪类选择器，加10
• 对于选择其中给定的各个元素标签选择器，加1
• 如果权值一样，则按照样式规则的先后顺序来应用，顺序靠后的覆盖靠前的规则

以下是权重的规则：标签的权重为1，class的权重为10，id的权重为100，以下/// 例子是演示各种定义的权重值：

/*权重为1*/
div{
}
/*权重为10*/
.class1{
}
/*权重为100*/
#id1{
}
/*权重为100+1=101*/
#id1 div{
}
/*权重为10+1=11*/
.class1 div{
}
/*权重为10+10+1=21*/
.class1 .class2 div{
}

如果权重相同，则最后定义的样式会起作用，但是应该避免这种情况出现