CSS选择器的主要功能就是选中页面指定的标签元素，选中了元素，才可以设置元素的属性。
CSS选择器主要有以下几种:
- 标签选择器
- 类选择器
- id选择器
- 复合选择器
- 通配符选择器
接下来用代码来学习这几个选择器的使用。
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title>
</head>
<body><div class="font32">我是⼀个div, class为font32</div><div class="font32">我是⼀个div, class为font32</div><div><a href="#">我是⼀个div</a></div><span>我是一个span</span><ul><li>aaa</li><li>bbb</li><li><a href="#">ccc</a></li></ul><ol><li>1111</li><li>2222</li><li>3333</li></ol><button id="submit">提交</button>
</body>
</html>初始的页面为：
其中超链接的颜色默认为图中颜色。
一、标签选择器
示例：
span {color: red;
}这里就是选择所有的span标签，设置颜色为红色。
这时的页面显示为：
可见，span标签元素的颜色变为了红色。
二、类选择器
示例：
.font32 {color: red;}选择class为font32的元素, 设置颜色为红色。
⼀个类可以被多个标签使用, ⼀个标签也能使用多个类(多个类名要使用空格分割, 这种做法可以让代码更好复用)
这是页面显示为：
三、id选择器
id 是唯⼀的, 不能被多个标签使用(是和 类选择器 最大的区别)
示例：
/* 选择id为submit的元素, 设置颜⾊为红⾊ */
#submit {color: red;
}这是页面显示为：
四、复合选择器
示例：
/*只设置 ul标签下的 li标签下的 a标签, 颜⾊为紫⾊*/
ul li a {color: purple;}
- 以上三个标签选择器 ul li a 中的任意, 都可以替换成类选择器, 或者id选择器, 可以是任意选择器的组合, 也可以是任意数量选择器的组合
- 不⼀定是相邻的标签, 也可以是"孙子"标签
- 如果需要选择多种标签, 可以使用逗号分割, 如 p, div { } 表示同时选中p标签和div标签.逗号前后可以是以上任意选择器, 也可以是选择器的组合.
这是页面显示为：
五、通配符选择器
示例：
/* 设置⻚⾯所有元素, 颜⾊为红⾊*/
* {color: red;
}这是页面如下图所示：
