大家好，欢迎来到无限大的频道。
类选择器和ID选择器都是CSS中用于选择元素并应用样式的工具，但它们有一些关键的区别：
1. 语法
- 类选择器：以点号（`.`）开头，后面跟类名。一个类选择器可以选择多个元素。
- 例如：`.my-class`，用于选择 class 属性为 `my-class` 的所有元素。
- ID选择器：以井号（`#`）开头，后面跟ID名。一个ID选择器只能选择一个特定元素，因为在一个HTML文档中，ID属性应该是唯一的。
- 例如：`#my-id`，用于选择 id 属性为 `my-id` 的元素。
2. 使用场景
- 类选择器：适用于当你需要对多个元素应用相同的样式时。例如，多个不同的段落、按钮或其他元素可能会共享一个类。
<p class="highlight">这是一个高亮段落。</p><p class="highlight">这是另一个高亮段落。</p>- ID选择器：用于需要唯一标识的元素，例如一个网页的导航、页脚或特定的内容区域。由于不能在同一文档中重复使用ID，因此通常用来选择特定的元素。
<div id="header">网站标题</div><div id="footer">网站底部信息</div>
3. 优先级
- 类选择器：在CSS中的权重相对较低。
- ID选择器：在CSS中的权重相对较高。在同样的情况下，如果有冲突，ID选择器的样式将覆盖类选择器的样式。
4. 定义与引用
- 类选择器可以在HTML元素的 `class` 属性中使用，可以在多个元素上使用同一个类。
<div class="box"></div>
<span class="box"></span>- ID选择器只能在HTML文档中一个元素的 `id` 属性中使用，必须保证唯一性。
<div id="header"></div>5. 示例
<!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>.highlight {color: red; /* 类选择器 */}#unique {color: blue; /* ID选择器 */}</style>
</head>
<body><p class="highlight">这个段落将会是红色的。</p><p class="highlight">这个段落也将是红色的。</p><p id="unique">这个段落将会是蓝色的。</p>
</body>
</html>
![[C语言]--自定义类型: 结构体](https://i-blog.csdnimg.cn/direct/e1adefea02904381b092f68cb202f5fe.png)
