理解选择器是编写可维护、可扩展的CSS的关键，选择器是CSS规则与元素匹配的机制，有很多方法可以做到这一点，其中的大多数都很熟悉。如元素类型、类名、ID和属性选择器，都得到了很好的支持和广泛的使用。
在本章中，我们将首先回顾选择器的类型。然后，我们将研究当前浏览器的CSS选择器，重点关注由选择器级别3和选择器级别4规范定义的新选择器。
本章将不会展开介绍所有的选择器，因为这可能会占用整本书。相反，我们将专注于具有良好浏览器支持的选择器，这些选择器可能对你当前的工作有用。
选择器类型
选择器可以分为四种基本类型：简单、复合、组合和复杂。
简单选择器
简单选择器是最古老的CSS选择器形式，并且可能是最常用的类型。简单选择器 为匹配元素指定单个条件。通用选择器（*）是一个简单的选择器。类型（或标签）选择器，如 p 和 伪元素选择器，如 ::first-letter 。属性选择器，如 [hidden] ，类选择器 .message-error 和 ID 选择器（如 #masthead）也属于这个类别。
复合选择器
复合选择器，如 p:last-child 或者 .message.error，是一系列简单的选择器，它们反映了在将规则应用于元素时要满足的一组同时发生的条件。换句话说 .message.error 将匹配 <div class="message error"> ，但不匹配 <div class="message"> 或 <div class="error"> 。
复合选择器是由两个或多个简单选择器，通过不同的方式组合而成的，目的是为了可以选择更准确更精细的目标元素标签。
组合选择器
组合选择器，表示元素之间的关系，有以下四种：
- 后代组合，如
article p，定义标签article里面的p的样式； - 子组合
>，如.sidebar > h2，定义.sidebar的子元素h2的样式； - 相邻兄弟组合
+，如ul + p - 一般兄弟组合 ~，如
p ~ figure
当符合组合选择器表示的条件时，规则将应用于组合器选择器中最右侧的元素，后面将详细介绍组合选择器。
复杂选择器
复杂选择器由一个或多个由组合选择器分隔的复合选择器组成，如 ul:not(.square) > a[rel=external] 。
选择器可以通过逗号将它们分隔成选择器列表，选择器列表对匹配列表中任何选择器的元素应用样式。例如，规则 article,div {padding: 20px;} 表示同时定义了 <article> 和 <div> 标签的样式 padding 属性为 20px。
了解你正在使用哪种选择器将有助于掌握 CSS 中更令人困惑的特征：特异性。保持低特异性可以增加 CSS 规则的可重用性。如选择器 #menu > .pop-open 意味着只能当它是 #menu 的直接后代时
才能使用 .pop-open 规则。
