一、常用选择器
1、类
.classname{}
2、id
#idName{}
3、标签
p{}
4、通配
*{}
5、并集：逗号分开
.box1,.box2{}
6、交集：
.box1.box2{}
二、后代选择器
1、后代：祖先元素 后代元素
.super .sub{}
2、子元素选择器：父元素>子元素
.father>.son{}
三、伪元素与伪类
伪类：本质上是用来补充常规选择器无法选择的内容，使用：表示
伪元素：可以创建一些语言文档无法创建的虚拟元素，可以在其中添加样式和内容，使用：：表示
1、:before :after
p:before{content:'使用伪类添加的内容'}
2、:link点击 :visited点击过的 :hover鼠标滑过 :active正在点击
注意：如果一起使用，顺序必须是如上、链接是通过历史记录来判断是否被访问过的，所以visited是能设置文字颜色
3、:focus
5、::before ::after ::first-letter ::first-line
6、否定伪类
div:not(.box){} 匹配所有div中除了class为box的所有元素
四、兄弟选择器
1）匹配紧随其后的一个 前一个+后一个 span+p{}
2) 匹配当前元素后面所有的 前一个~后一个 span~p{}
五、属性选择器
[属性名]选取含有指定属性的元素[属性名="abc"]选取指定属性值为abc的元素[属性名^="a"]选取指定属性以a开头的元素[属性名$="b"]选取指定属性值以b结尾的元素[属性名*="g"]选取指定属性值包含g的元素
六、序选择器(css3新增)
1）同级别中的第几个
:first-child 选择的是结构意义上的第一个子元素
p:first-child 所有元素中的第一个子元素的p元素
div>p:first-child div中的第一个子元素并且是p元素
div:first-child p{} 所有元素中的第一个子元素并且是div元素的所有p元素
:last-child :only-child
2）同类型中的第几个
:first-of-type 匹配的是该类型中的第一个 :last-of-type
:nth-of-type(n) :nth-last-of-type only-of-type