1. 通配选择器
作用：可以选中所有的 HTML 元素。
语法：
* {
属性名: 属性值;
} 举例：
<!DOCTYPE html>
<html lang="zh-cn">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>通配选择器</title><style>* {color: red;}</style></head>
<body><p>学习css最重要的是坚持</p><p>学习web后端最重要的是仔细</p><p>这样才能找到工作</p>
</body>
</html>
2. 元素选择器
作用：为页面中 某种元素 统一设置样式。
语法
标签名 {
属性名: 属性值;
} 举例：
<!DOCTYPE html>
<html lang="zh-cn">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>元素选择器</title><style>p{color: beige;}</style></head>
<body><p>学习css最重要的是坚持</p><p>学习web后端最重要的是仔细</p><p>这样才能找到工作</p>
</body>
</html>
3. 类选择器
作用：根据元素的 class 值，来选中某些元素。
语法
.类名 {
属性名: 属性值;
} 举例：
<!DOCTYPE html>
<html lang="zh-cn"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>元素选择器</title><style>.red {color: red;}.bulue{color: blue;}.px{font-size: 30px;}</style></head><body><p class="red">学习css最重要的是坚持</p><p class="bulue">学习web后端最重要的是仔细</p><p class="px">这样才能找到工作</p>
</body></html>
1. 元素的 class 属性值不带 . ，但 CSS 的类选择器要带 . 。2. class 值，是我们自定义的，按照标准：不要使用纯数字、不要使用中文、尽量使用英文与数字的组合，若由多个单词组成，使用 - 做连接，例如： left-menu ，且命名要有意义，做到 “见名知意”。3. 一个元素不能写多个 class 属性，下面是 错误示例：<!-- 该写法错误，元素的属性不能重复，后写的会失效 --><h1 class = "speak" class = "big" > 你好啊 </h1>4. 一个元素的 class 属性，能写多个值，要用空格隔开，例如：
4. ID选择器
作用：根据元素的 id 属性值，来 精准的 选中 某个 元素。
语法：
#id值 {
属性名: 属性值;
} 举例
<!DOCTYPE html>
<html lang="zh-cn"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>ID选择器</title><style>#red {color: red;}#bulue{color: blue;}#px{font-size: 30px;}</style></head><body><p id="red">学习css最重要的是坚持</p><p id="bulue">学习web后端最重要的是仔细</p><p id="px">这样才能找到工作</p>
</body></html>
注意：id 属性值：尽量由字母、数字、下划线( _ )、短杠( - )组成，最好以字母开头、不要包含空格、区分大小写。一个元素只能拥有一个 id 属性，多个元素的 id 属性值不能相同。一个元素可以同时拥有 id 和 class 属性。
类选择器
选中所有特定类名（ class 值）的元素 —— 使用频 率很高
综合
<!DOCTYPE html>
<html lang="zh-cn"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>基本选择器综合</title><style>#red{color: red;}.gree{font-size: 100px;}p{background-color: azure;}</style></head><body><p id="red" class="gree blue">学习css最重要的是坚持</p><p id="bulue">学习web后端最重要的是仔细</p><p id="px">这样才能找到工作</p>
</body></html>