所谓基本选择器是指选择器的名称前面没有其他选择器，即在组成上，基本选择器是单一名称。
基本选择器主要包括：
元素选择器
ID 选择器
类选择器
伪类选择器
伪元素选择器
通用选择器
元素选择器
在 W3C 标准中，元素选择器又称为类型选择器。使用元素选择器设置样式的语法如下：
元素选择器 {
属性 1: 属性值 1；
属性 2: 属性值 2；
...
}
语法说明：元素选择器重新定义了 HTML 标签的显示效果，网页中的任何一个 HTML 标签都可以作为相应的元素选择器的名称，设置的样式对整个网页的该类元素有效。
例如，div 元素选择器就是声明当前页面中所有的 div 元素的显示效果。元素选择器样式应用是通过匹配 HTML 文档元素来实现的。
【示例 2-2】元素选择器使用。
元素选择器的使用
妙味公告
妙味课堂
miaov 公告
miaov 课堂
上述 CSS 代码使用 div 作为元素选择器，这样就选中了页面上所有的 div 元素，因而在大括号内设置的任何样式，对页面中所有 div 元素都有效。运行结果如图 2-4 所示。
ID 选择器
从上一节的介绍中，我们知道，元素选择器可以选择某一类元素。很显然，如果需要某一类元素中某个元素设置特定的样式，比如，对示例 2-2 中第一个div元素设置不同样式，此时使用元素选择器将无满足需要，针对这种情况，我们可以使用 ID 选择器。
ID 选择器的名称为元素的 id 属性值，它可以针对一个元素进行样式设置，需注意的是 ID 名称在一个 HTML 页面中必须唯一，你可以理解为 ID 就像是一个人的身份证号一样，不可重复。所以一个 ID 选择器只允许设置一个元素的样式。在设置前必须加上标识符“#”。
使用 ID 选择器设置样式的语法如下：
#ID 选择器 {
属性 1: 属性值 1；
属性 2: 属性值 2；
...
}
语法说明：ID 选择器名称的第一个字符不能使用数字；ID 选择器名不允许有空格，选择器名前的“#”是 ID 选择器的标识，不能省略；另外，ID 选择器名区分大小写，应用时应正确书写。
【示例 2-3】ID 选择器使用。
ID 选择器的使用
妙味课堂
妙味课程
妙味讲师
上述代码中有 3 个 div 元素，其中第 3 个 div 设置了 id 属性，值为“teacher”。CSS 代码通过匹配 id 属性值，可知 ID 选择器选中了第 3 个 div 元素，因而其设置的绿色文本颜色以及加粗样式，只对第 3 个 div 元素有效，其他两个 div 元素的样式则保持默认效果。
示例 2-3 的运行结果如图 2-5 所示。
还有一些情况也很常见，例如我们希望有一列 div 具备公共样式，比如统一的背景、统一的大小等，但我们希望其中一个元素样式略有不同，希望针对这个元素设置特殊样式，此时我们可以结合元素选择器和 ID 选择器来共同设置样式：元素选择器设置公共样式，ID 选择器设置特殊样式。具体示例如下。
【示例 2-4】结合元素选择器和 ID 选择器共同设置元素样式。
结合元素选择器和 ID 选择器共同设置元素样式
妙味课堂
miaov 课程
妙味讲师
上述代码中的 3 个 div 元素内容都需要加粗并以 26px 字号显示，同时，都包含背景颜色，但第 3 个 div 元素内容的文本颜色要求为绿色。可见，三个 div 存在公共样式，同时，第三个 div 存在特殊样式。对 div 的公共样式可使用 div 元素选择器进行设置，而第 3个 div 的特殊样式则使用 ID 选择器进行设置，示例 2-4 在浏览器中的最终运行结果如图 2-6 所示。
由于 ID 名不可重复，所以 ID 选择器只能选择单个元素。ID 选择器的这个特性在某些情况下，会给我们带来不便。比如我们使用 ID 选择器对示例 2-2 中的 4 个 div 元素设置样式，要求是其中第 1 个和第 3 个 div 的文本颜色为红色，第 2 个和第 4 个 div 的文本颜色为蓝色。使用 ID 选择器就需要对各个 div 都设置好 id 属性，将示例 2-2 的代码修改如下。
【示例 2-5】页面存在多个元素具有相同样式时使用 ID 选择器的问题。
页面存在多个元素具有相同样式时使用 ID 选择器的问题
妙味公告
妙味课堂
miaov 公告
miaov 课堂
示例 2-5 的 CSS 代码中，虽然第 1 个和第 3 个 div、第 2 个和第 4 个 div 的样式完全相同，但由于使用 ID 选择器，相同样式也要使用不同 ID 选择器去定义（因为 ID 名必须唯一）。可见，针对多个元素具有相同样式的情况，使用 ID 选择器是不可取的。此时是否可以使用元素选择器呢？很显然，这种情况下，元素选择器更不可取，因为元素选择器会让所有同类元素使用同一种样式。
有关类选择器的介绍请参见下一小节。示例 2-5 的运行结果如图 2-7 所示。
类选择器
在上一小节最后，我们说示例 2-5 中的样式设置使用类选择器最合适。那么什么是类选择器呢？其实，类选择器也是一种基本选择器，它和 ID 选择器一样，可以允许以一种独立于文档元素的方式来指定样式。与 ID 选择器不同的是，类选择器的名称为元素的 class 属性值，一个类名在 HTML 页面中可以重复出现多次，此外，类选择器名前面必须加上“.”作为标识符。
使用类选择器设置样式的语法如下：
. 类选择器 {
属性 1: 属性值 1；
属性 2: 属性值 2；
...
语法说明：类选择器名称的第一个字符不能使用数字；类选择器名前的“.”是类选择器的标识，不能省略；另外，类选择器的命名是区分大小的，应用时应正确书写。
下面使用类选择器设置示例 2-5 的 div 样式。大家可以看到，第 1 个和第 2 个 div 的 class 属性值一样，
第 3 个和第 4 个 div 的 class 属性值一样。
具体代码如下。
【示例 2-6】使用类选择器设置示例 2-5 的 div 样式。
类选择器的使用
妙味公告
妙味课堂
miaov 公告
miaov 课堂
上述代码的运行结果和图 2-7 完全相同。
在 2.3.2 小节中，我们知道，ID 选择器可以在一组同类元素中选取某个元素，其实类选择器同样具有这个能力，但不同的是，类选择器可一次性选取若干个元素。
例如：有三组 div 元素，它们的字体大小均为 26px，并且是加粗显示，但其中前两个 div 的字体是绿色，且字体是斜体，在这样的需求下，可以结合元素选择器和类选择器来共同完成样式设置，具体示例如下。
【示例 2-7】结合元素选择器和类选择器共同设置元素样式。
结合元素选择器和类选择器共同设置元素样式
妙味课程 
