CSS的选择器的分类

1.标签选择器

一个XHTML文档中有许多标签，例如p标签，h1标签等。若要使文档中的所有p标签都使用同一个CSS样式，就应使用标签选择器。

div {color:red;border:1px blue solid;} 
p {color:#000;} 

2.类选择器

使用标签选择器可以为整个XHTML文档中的同一个标签指定相同的CSS样式。但是在实际运用中，XHTML文档中的同一个标签会被反复使用。若要为相同的标签赋予不同的CSS样式就应使用类选择器。 

<div class="test">测试代码</div> 
//样式根据class的名称定义表示
.test {color:red;border:1px blue solid;}

3.ID选择器(一个标签只能定义一个，前端开发尽量少用)

<div id="test">测试代码</div> 
//格式如下
#test {color:red;border:1px blue solid;} 

4.全局选择器

全局选择器是一个星号。它能作用于XHTML文档中的所有元素。

*{margin:0; padding:0;} 

5.组合选择器

标签选择器、类选择器和ID选择器是可以组合起来使用的。一般的组合方式是标签选择器和类选择器组合，标签选择器和ID选择器组合。由于这两种组合方式的原理和效果一样，所以只介绍标签选择器和类选择器的组合。组合选择器只是一种组合形式，并不算是一种真正的选择器，但在实际中经常使用。 

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

6.继承选择器

学习使用继承选择器就必须先了解文档树和CSS的继承。每个XHTML都可以被看作一个文档树，文档树的根部就是html标签，而head和body标签就是其子元素。在head和body里的其他标签就是html标签的孙子元素。整个XHTML就呈现一种祖先和子孙的树状关系。CSS的继承是指子孙元素继承祖先元素的某些属性。以下通过实例来详细讲解这两个重要的CSS概念。

<div class="test"> 
<span><img src="xxx" alt="示例图片"/></span> 
</div> 
.test span img {border:1px blue solid;} 
div span img {border:1px blue solid;} 

7.伪类选择器

参考W3Cschool中的介绍http://www.w3school.com.cn/css/css_pseudo_classes.asp