给你简单得举个栗子：

1st：

<style type="text/css">

    p{color:#333}

</style>

<!--这里我们引入一个p标签，设定文字颜色为灰色-->

<p>我是栗子。</p>

<p>我也是栗子。</p>

<a href="#">我还是栗子。</a>

2nd:

<style type="text/css">

    .color{color:#333}

</style>

<!--这里我们引入一个类，同样设定文字颜色为灰色-->

<p>我是栗子。</p>

<p class="color">我也是栗子。</p>

<a href="#" class="color">我还是栗子。</a>

<hr/>

看第一个例子，我们引入的是一个p标签。这样一来，这张网页的所有<p>都要变成灰色字体，你不能自由地设定第一行是灰色，第二行是默认色。而你也不能控制<a>字体变成灰色。

再看第二个例子，我们引入的是一个class。如果你需要这个类，你就引入它。你在第二个<p>里引入它，那么第二个<p>就变成灰色的了，你在<a>里面引入它，那么<a>就变成灰色的了。

简单地理解（事实上有时候并非如此），标签选择器的范围更广，类选择器更自由。

以上