1.传统CSS2.1选择器
（1）标签选择器
标签选择器称为元素选择器、类型选择器，它直接使用元素的标签名当作选择器，将选择页面上所有该种标签。
例如：span{
color: red;
}
b{
color: green;
}
选择所有的span标签，b标签
标签选择器将选择页面上所有的该种标签，无论这个标签所处的位置深浅，“覆盖面非常大”，所以通常用于标签的初始化。
例如：ul{
/*去掉无序列表的小圆点*/
list-style:none;
}
a{
/*去掉超级链接的下划线*/
text-decoration: none;
}
（2）id选择器
标签可以有id属性，是这个标签的唯一标识，id的名称只能由字母、数字、下划线、短横构成，且不能以数字开头，字母区分大小写，但习惯上一般为小写字母,同一个页面上不能有相同id的标签。
例如： < p id="para1">段落< /p>
CSS选择器可以使用井号#前缀，选择指定id的标签
（3）复合选择器
选择器名称 示例 示例的意义
后代选择器 .box .spec 选择类名为box的标签内部的类名为spec的标签
交集选择器 li.spec 选择既是li标签，也属于spec类的标签
并集选择器 ul, ol 选择所有ul和ol标签
CSS选择器中，使用空格表示“后代”，后代并不一定是子标签，后代选择器可以有很多空格，隔开好几代。
并集选择器中的逗号表示”，“分组。
选择器可以任何搭配、组合，从而形成复合选择器，必须要能一目了然的看出选择器代表的含义。
2. CSS3新增选择器
（1）元素关系选择器
名称 举例 意义
子选择器 div>p div的子标签p
相邻兄弟选择器 img+p 图片后面紧跟着的段落将被选中
通用兄弟选择器 p~span p元素之后的所有同层级span元素
子选择器，当使用>符号分隔两个元素时，它只会匹配那些作为第一个元素的直接后代元素，即两个标签为父子关系。
相邻兄弟选择器（+）介于两个选择器之间，当第二个元素紧跟在第一个元素之后，并且两个元素都是属于同一个父元素的子元素，则第二个元素将被选中。
通用兄弟选择器（），ab选择a元素之后所有同层级 b元素，通用兄弟选择器从IE7开始兼容。
（2）序号选择器
举例 意义
:first-child 第一个子元素
:last-child 最后一个子元素
:nth-child(3) 第3个子元素
:nth-of-type(3) 第3个某种类型子元素
:nth-last-child(3) 倒数第3个子元素
:nth-last-of-type(3) 倒数第3个某类型子元素
:nth-child()可以选择任意序号的子元素，还可以写成an+b的形式，表示从b开始每a个选一个。
2n+1等价于odd，表示奇数。
2n等价于even，表示偶数。
:nth-of-type（)将选择同种标签指定序号的子元素。
（3）属性选择器
img[ alt] 选择有alt属性的img标签
（4）CSS3伪类
伪类是添加到选择器的描述性词语，指定要选择的元素的特殊状态，超级链接拥有4个特殊状态。
伪类 意义
:empty 选择空标签
:focus 选择当前获得焦点的表单元素
:enabled 选择当前有效的表单元素
:disabled 选择当前无效的表单元素
:checked 选择当前已经勾选的单选按钮或者复选框
:root 选择根元素，即<html>标签
a:link 没有被访问的超级链接
a:visited 已经被访问过的超级链接
a:hover 正被鼠标悬停的超级链接
a.active 正被激活的超级链接（按下按键但是还没有松开按键）
a标签的伪类书写，要按照“爱恨准则”的顺序，否则会有伪类不生效。
LOVE HATE
（5）伪元素
伪元素表示虚拟动态创建的元素，伪元素用双冒号表示。
::before创建一个伪元素，其将成为匹配选中的元素的第一个子元素，必须设置content表示其中的内容。
::after创建一个伪元素，其将成为匹配选中的元素的最后一个子元素，必须设置content表示其中的内容。
::selection CSS伪元素应用于文档中被用户高亮的部分（使用鼠标圈选的部分）。
::first-letter会选中块级元素中第一行的第一个字母。
::first-line会选中块级元素第一行全部文字。
3.层叠性和选择器权重计算
层叠性指的是多个选择器可以同时作用于同一个标签，效果叠加。
CSS有严密的处理冲突的规则
id权重>class权重>标签权重
复杂选择器可以通过（id的个数，class的个数，标签的个数）的形式，计算权重。
！important将某个选择器的某条属性提升权重。
