CSS3的选择器

1、层级选择器：
子代选择器>
兄弟选择器+，这个只选择了后面第一个兄弟选择器，如果要选择后面所有的兄弟选择器，用~符号

2、属性选择器：
如果要根据属性选择，可以用中括号表示，如[class]；
如果更具体的选择某个标签下的属性，如div[class]；
div[class=box1]等同于div .box1，但是如果class有两个值，是不匹配的，这个是完全匹配，可以用div[class~=box1]表示模糊匹配
也可以用简单的正则表达式模糊匹配，如class^=b代表b开头的属性值、class$=b表示b结尾的属性值、class=*b包含b的属性值

3、伪类选择器：
第一个孩子，如ul li:first-child，最后一个孩子，如ul li:last-child，第几个孩子，如ul li:nth-child(num)，如果想指定偶数的孩子，num可以为2n或者even，想指定奇数，num可以为2n-1或者2n+1或者odd
只有一个孩子的标签，如ul li:only-child
没有孩子的标签，如ul:empty，这里的没有孩子指的是标签下没有任何内容，包括空格
:root就是html标签

4、目标伪类选择器：
一般是配合锚点使用，div:target表示触发这个锚点后的设置

5、UI状态伪类选择器：
一般配合表单或者文本，根据标签的状态来选择设置
选择可用的标签，如input:enabled，选择禁用的标签，如input:disabled，选择选中属性的标签，如input:focus，这个一般不用设置focus，表单都自带这个属性；
对于选择标签，如input:checked，这个也不需要设置
对于文本标签，如input::selection，表示选择文本内容时的设置，注意这里是两个冒号

6、否定和动态伪类选择器
否定伪类选择器是不包含的意思，如ul li:not(:first-child)表示除了第一个孩子的其它标签
动态伪类选择器一般配合链接标签使用，针对鼠标动作，跟UI状态伪类选择器用法类似，都是针对鼠标的不同动作是进行设置