通过选择器的使用，你不再需要在编辑样式时使用多余的以及没有任何语义的class属性，而是直接将元素和样式绑定起来，从而节省大量在网站或web应用程序已经完成之后修改样式时所需花费的时间。
一、选择器的概述
选择器是css3中一个重要的内容，如果在页面中定义多个class属性，并不能将元素和样式绑定起来，使用class的缺点：第一，class属性本身没有语义，它纯粹是为css样式服务的，属于多余的属性；第二，使用class属性的话，没有把元素和样式绑定起来，一个class属性，多个元素可以多处使用，造成修改样式时很不方便。
如：div[id="div_big"]{.......}
二、属性选择器
1、属性选择器概述，在html中，通过各种各样的属性，我们可以给元素增加很多附属信息，例如通过id属性，我们可以将不同的div元素进行区分，并且通过javascript来控制这个div元素的内容和状态。
css2中属性选择器：[att=val]，其中att代表属性，val代表属性值。
css3中新增了三个属性选择器：
[att*=val]，表示属性的属性值中包含用val指定的字符，则该元素使用该样式。
[att^=val]，表示属性的属性值如果是以val指定的字符开头的，则该元素使用该样式。
[att$=val]，表示属性的属性值如果是以val指定的字符结尾的，则该元素使用该样式，如：[id$=\-1]{......}，这里要注意，该属性选择器在指定匹配字符前必须加上“\”。
三、结构性伪类选择器
1、css3中伪类选择器及伪元素
css3中的类选择器可以随意起名，如：p.left、p.right，然后页面上使用“class="left"、class="right"”，但是伪类选择器是css中已经定义好的选择器，不能随便起名。比如在使用在a元素上的几个伪类选择器：a:link、a:visited、a:hover、a:active
2、伪元素选择器
伪元素选择器是指并不是针对真正的元素使用的选择器，而是针对css中已经定义好的伪元素使用的选择器。它的使用方法：
选择器：伪元素{属性：值}
伪元素选择器可以和类配合使用：选择器.类名：伪元素{属性：值}
css中主要有以下四种伪元素选择器：
first-line伪元素选择器：用于向某个元素中的第一行文字使用样式。
first-letter伪元素选择器：用于向某个元素中的文字的首字母或第一个字使用样式。
before伪元素选择器：用于在某个元素之前插入一些内容。如：p:before{content:"aaa"}（行级）
after伪元素选择器：用于在某个元素之后插入一些内容。（行级）
3、结构性伪类选择器
root选择器：将样式绑定到页面的根元素中，根元素是位于文档树中最顶层结构的元素，在html页面中就是指包含整个页面的“<html>”部分。
not选择器：如果想对某个结构元素使用样式，但是想排除这个结构元素下面的子结构元素，让它不使用这个样式。
empty选择器：用来指定当元素中内容为空白时使用的样式。
target选择器：对页面中某个target元素（该元素的id被当作页面中的超链接来使用）指定样式，该样式只在用户点击了页面中的超链接，并且跳转到target元素后起作用。
first-child选择器：选择父元素中的第一个元素。
last-child选择器：选择父元素中的最后一个元素。
nth-child(n)：表示第n个子元素。
nth-last-child(n)：表示倒数第n个子元素。
nth-child(odd)：表示所有正数下来的第奇数个子元素。
nth-child(even)：表示所有正数下来的第偶数个子元素。
nth-last-child(odd)：表示所有倒数下来的第奇数个子元素。
nth-last-child(even)：表示所有倒数下来的第偶数个子元素。
nth-of-type(odd)：
nth-of-type(even)
nth-last-of-type(odd)
nth-last-of-type(even)
循环使用样式
nth-child(4n+1)
nth-child(4n+2)
nth-child(4n+3)
nth-child(4n+4)，这里“4n+4”可以缩写成"4n"
only-child：相当于nth-child(1):nth-last-child(1)