css权重问题

1.什么是css权重？
“css权重关系到你的css规则是怎样显示的”。
当很多规则作用到一个元素上，权重会决定那种规则会生效，也就是优先级的问题。如果两个选择器同时作用在一个元素上，则权重高者生效。
2.权重分为四个等级
1）、行内样式，指html里的style（它的权重值是1000）
行内样式对你的元素直接产生作用。

<div style="color:red"></div>

2)、ID选择器(它的权重值是100)
id选择器是一种标识，比如#btn.

<div id="btn"></div>

3）、类、属性选择器和伪类选择器(它的权重值是10)
这一类包括各种class，属性选择器，伪类选择器比如 :hover,:focus等等。
4）、元素和伪元素（它的权重值是1）
元素和伪元素选择器，比如：after和：before
伪元素选择器只包含以下几种:

::after
::before
::first-letter
::first-line
::selecton

伪元素和伪类的补充：伪类表示的是一种状态，比如：hover、active等等，而伪类表示的是文档确定的某个部分的表现。
3、怎么确定权重值
1）、相同的权重，以后面出现的选择器为最后规则
举个栗子：

#add  span{
      color:red;
}
#add  span{
      color:blue;
}

两个选择器的权重值都是0、1,0、1，最终后面的生效
2、不同权重，权重值高者生效
举个栗子：

<div id="content">
		<span class="highlight">hello world</span>
</div>
#content span{
 			color:red;
}
.highlight{
			color:blue;
}

#content span的权重值是101，.highlight是10，所以权重高的生效