简单选择器利用单一的特征来选择元素，但有时我们需要更多的特征才能定位到一个元素。比如下面这段 HTML 代码。
<div> <p>one</p> <p class="note">two</p> <span class="note">three</p> </div>
如何只选择第二个 p 元素？
用类型选择器 p 可以吗？不行，因为它不仅会选择第二个 p 元素，也会选择第一个 p 元素。
用类选择器 .note 可以吗？不行，因为它不仅会选择第二个 p 元素，也会选择 span 元素。
由此可见利用单一的特征是无法或很难只选择第二个 p 元素的。
为此我们需要在简单选择器的基础上增加一种手段，让我们可以利用多个特征来选择元素。
级联选择器就是把多个简单选择器级联在一起，从而实现元素的多特征选择。
让我们回到上面的例子。如果我们把类型特征和类特征综合起来是不是就可以选中第二个元素呢？答案是肯定的。这个新的选择器就是 p.note ，它将类型选择器 p 和类选择器 .note 级联在一起，用两个特征精确定位到第二个 p 元素。
使用级联选择器时有三点注意事项：
- 如果级联选择器包含了类型选择器或通用类型选择器，那么它们需要放在最前面。
- 级联选择器只能包含一个类型选择器或通用类型选择器。
- 级联选择器中选择器必须紧密相连，它们之间不允许出现空格或其它将它们分开的字符。
