从零开始自学入门CSS(2)：css选择器

前一篇文章中，曾讲过css的使用方法，就是选择器+声明，不过我们当时的选择器选择的都是元素标签，更改元素标签后，html文档中所有该标签都使用同一个样式，很显然，只凭借该选择器无法支撑起现代流行网页的美观。所以我们就需要使用另外两个选择器：Id选择器和class选择器。

id选择器

要使用id选择器，要在需要改变的元素标签中加入键值对形式的id属性，如：

<p id="test">id选择器</p>

这样我们就为<p>标签定义了id属性，要改变<p>标签的样式也很简单，在样式中使用#id的方式就行了，如:

#test {color:red;}

这里我们为id="test"的<p>标签添加了颜色：红色。html文档中其他的<p>标签则不会改变颜色。

注意：id选择器只能使用一次，也就是不能为多个标签设置同一个id。

class选择器

class选择器，又叫类选择器，可以用在多个元素标签中。用法和id选择器雷同，首先在元素标签中加入键值对形式的class属性，如：

<h1 class="cla">class选择器</h1>
<p class="cla">class选择器</p>

然后在样式表中使用.class来添加样式，如：

.cla {color:red;}

这里包含有class="cla"的<h1>标签和<p>标签都会被改变颜色。而不包含该class的元素标签则不在此列。

id选择器和class选择器

id选择器和class选择器最大的不同在于id选择器只能使用一次，而class可以作用在多个不同的元素标签中。

class，又叫类，意思就是同一类、一组，在html文档中尽量多使用class选择器。id选择器更多的是与JavaScript一起使用。