CSS选择器权重问题

我们在写CSS样式的时候有可能出现这样的问题就是说写完样式后样式却没有发生改变，如果代码没有问题那么就可能是我们的权重产生问题了。

我们这里来说一下css选择器权重的大小

1、看下面两图，图一我通过大部分常用的选择器设置的div的样式，而通过图二的显示可以看出来它选择了内联样式的一个样式显示可以得出在图一中内联的权重最大

2、然后把内联样式去除可以看出浏览器显示了ID选择器的样式，由此可以看出ID选择器的权重在我举例中次于内联选择器

3、再接着往下把ID选择器注释掉浏览器显示的类选择器的样式，由此得出在此次举例中类的权重再第三

4、再接着往下就不用说了把类选择器注释掉浏览器显示的是标签选择器的样式，由此得出在此次举例中标签权重最小。

其实在css内部已经定义好了样式的权重值，

标签：+1      类：+10        ID：+100      内联样式：+1000

如果你设置的两种样式那么权重大的就会把小的给覆盖掉，还有权重是可以相加的所以如果发现权重不够是可以加权重的。

但这里有一个特殊情况 ！important  通过下图可以看到我在标签选择器的样式后加了！important 理应它的样式会被后面的ID样式覆盖但它没有原因正是！important的影响，它会强制设置样式，这种方式不到万不得以不推荐使用因为你以后更改样式的就有些困难。