在我看来，选择器的种类定义为三种比较合适，标签名选择器；类选择器；ID选择器；后代选择器和群组选择器只不过是对前三种选择器的扩展应用。而在标签内写入style=""的方式，应该是CSS的一种引入方式，而不是选择器，因为根本就没有用到选择器。但是在具体讲课的时候，考虑到让学生都能掌握中各种用法，我们习惯把这些都结合记起来讲，所有就有了所谓的5种或者6种的选择器。

我们分别来看下这些选择器：

1：类选择器

HTML：
<div class="test">测试代码</div>

CSS：
.test {color:red;border:1px blue solid;}

在html文档里，我们在要控制样式的标签的开标签（非成对标签如input直接放在标签里）里加入 class="xxx",在页面对应的css文件里，用.xxx就可以指向这个标签，从而对这个标签进行控制，我们称这种通过定义类（class）来找到标签的方式为 ：类选择器。

这种定义class 的方式是前端开发最常用的选择器，有几个突出的特点：可以给不同的标签设置同一个类，从而用一条CSS命令控制几个标签，减少大量代码，是页面修改简单，易维护，易改版；其次，后台工作人员机会不会用到有关class的相关设置，不需要跟后台人员之间进行交互；再者，可以通过js等动态改变标签的Classname，从而改变整个标签的样式，使前端动态效果实现起来更为容易。

2：标签名选择器

CSS:
div {color:red;border:1px blue solid;}
span {float:right;}

这个选择器十分简单，就是直接在CSS文件里用标签名找到对应的页面标签，在教学的过程中，也是最容易被学生接受的一种选择器，在实际的应用中，还是比较有用武之地的，我们习惯把它用在继承选择器里，比如 .orderlist li {xxxx} 或者  .tableset td {}    

我们使用的时候一般用在重复出现并且样式相同的一些标签里，不如 li td  dd等。

3：ID选择器

HTML：
<div id="test">测试代码</div>

CSS：
#test {color:red;border:1px blue solid;}

ID选择器跟类选择器有很大的不同：一个页面内不能出现相同的ID；再就是ID也是后台开发人员会经常用的，所以前端开发人员应该尽量少的使用。当然跟后台人员的工作配合十分娴熟之后，这些都不会成为限制。

选择器的扩展应用：

4：后代选择器
HTML：
<div class="test">
<span><img src="xxx" alt="示例图片"/></span>
</div>

CSS：
.test span img {border:1px blue solid;}
div span img {border:1px blue solid;}

后代选贼器实际上是使用：多个选择器加上中间的空格来找到具体的要控制标签；从左往右，依次细化，最后锁定要控制的标签，如上例，先找到class为test的标签，再从他的子标签里查找span标签，再从span的子标签中找到IMG标签。

5：群组选择器

CSS：
.test1,span,test2 {border:1px blue solid;}
div,span,img {border:1px blue solid;}

群组选择器实际上是对CSS的一种简化写法，只不过把有相同定义的不同选择器放在一起，省了很多代码。

CSS选择器的优先级，一直是初学者比较头痛的问题，经常会有人问我为什么我的CSS定义的属性不能显示，这时候的一般就是因为选择器的优先级问题，举个简单的例子：

HTML文档里存在下面的标签嵌套
<div class="test1">
<span class="span1">
span1的内容
</span>
<span>
span2的内容
</span>
</div>

如果我已经把.test1下面span内的字体设置成红色：

.test1 span {color:red;}

这时，如果我要改变.span1的颜色为蓝色，用下面的命令是不能实现的：

.span1 {color:blue;}

出现这种情况就是因为后一个命令的优先级不够，两条相互冲突的样式设置，浏览器只会执行优先级较高的那个。

选择器越特殊，它的优先级越高。也就是选择器指向的越准确，它的优先级就越高。
通常我们用1表示标签名选择器的优先级，用10表示类选择器的优先级，用100标示ID选择器的优先级。比如上例当中 .test1 span {color:red;}的选择器优先级是 10 + 1 也就是11；而 .span1 的优先级是10;浏览器自然会显示 红色的字。理解了这个道理之后下面的优先级计算自是易如反掌：

div.test1 .span var       优先级 1+10 +10 +1

span#xxx .songs li    优先级1+100 + 10 + 1

#xxx li      优先级 100 +1

对于什么情况下使用什么选择器，用不同选择器的原则是：第一：准确的选到要控制的标签；第二：使用最合理优先级的选择器；第三：HTML和CSS代码尽量简洁美观；这三条原则是多年工作经验的总结，想要做到尽善尽美需要大量的项目锻炼。
通常：1‘ 最常用的选择器是类选择器。2’：li、td、dd等经常大量连续出现，并且样式相同或者相类似的标签，我们采用类选择器跟标签名选择器结合的后代选择器 .xx li/td/dd {} 的方式选择。3：极少的情况下会用ID选择器，我个人是极少用的，不过有些前端开发人员喜欢把header,footer,banner,conntent设置成ID选择器的，因为相同的样式在一个页面里不可能有第二次。是没有任何问题的。

在这里不得不提使用在标签内引入CSS的方式来写CSS，即：
<div style="color:red">sdfsd</div>

这时候的优先级是最高的。我们给它的优先级是1000，这种写法不推荐使用，特别是对新手来说。这也完全违背了内容和显示分离的思想。DIV+CSS的优点也不能再有任何体现。