一、概述
在 CSS 中，id 和 class 选择器是用于为 HTML 元素指定样式的强大工具。它们可以帮助我们精确地控制页面中元素的样式，让页面设计更加灵活和高效。
二、id 选择器
1. 定义和使用
-
定义 ：
id选择器用于为具有特定id属性的 HTML 元素指定样式。在 CSS 中，id选择器以#开头。 -
示例：
HTML复制
<p id="para1">这是一个段落。</p>预览
css复制
#para1 { text-align: center; color: red; }在这个例子中，
id="para1"的段落会居中显示，并且文字颜色为红色。
2. 注意事项
-
id属性的值在文档中必须是唯一的，即一个id只能用于一个元素。 -
id属性的值不能以数字开头，否则在 Mozilla/Firefox 浏览器中可能不起作用。
三、class 选择器
1. 定义和使用
-
定义 ：
class选择器用于描述一组元素的样式。与id选择器不同，class可以在多个元素中使用。在 HTML 中，class选择器以class属性表示，在 CSS 中，类选择器以.开头。 -
示例：
HTML复制
<p class="center">这是一个段落。</p> <div class="center">这是一个 div 元素。</div>预览
css复制
.center { text-align: center; }在这个例子中，所有拥有
class="center"的 HTML 元素都会居中显示。
2. 特定元素的 class 使用
-
你可以指定特定的 HTML 元素使用
class。例如，只为<p>元素应用某个样式：HTML复制
<p class="center">这是一个段落。</p>预览
css复制
p.center { text-align: center; }在这个例子中，只有
<p>元素会应用center类的样式。
3. 多个 class 的使用
-
一个元素可以拥有多个
class，这些class之间用空格分隔。 -
示例：
HTML复制
<p class="center color">这是一个段落。</p>预览
css复制
.center { text-align: center; } .color { color: #ff0000; }在这个例子中，段落会居中显示，并且文字颜色为红色。
4. 注意事项
- 类名的第一个字符不能使用数字，否则在 Mozilla 或 Firefox 中可能不起作用。