CSS选择器优先级，权重问题

在页面中使用CSS选择器选中元素时，经常都是一个元素同时被多个选择器选中

比如：
– body h1

–h1 

上边的两个选择器都会选择h1元素，如果两个选择器设置的样式不一致那还好不会产生冲突，但是如果两个选择器设置的是同一个样式，这样h1到底要应用那个样式呢？CSS中会默认使用权重较大的样式，权重又是如何计算的呢？

不同的选择器有不同的权重值：
– 内联样式：权重是 1000
– id选择器：权重是 100
– 类、属性、伪类选择器：权重是 10
– 元素选择器：权重是 1
– 通配符：权重是 0

– 继承样式：没有优先级
计算权重需要将一个样式的全部选择器相加，比如上边的body h1的权重是20，h1的权重是10，所以第一个选择器设置的样式会优先显示。
注意：

①选择器优先级计算器不会超过它的最大数量级，例如11个类选择器相加权重不会超过100。

②如果优先级相同，则使用代码位置靠后的样式。

③并集选择器的优先级是单独计算的，例如：div,#p{}。

④可以在样式后添加！important，则此时该样式会获得一个最高的优先级，将会优先于所有的样式显示，甚至超过内联样式。例如：color:yellow !important;