CSS 重要概念之选择器

1. 标签选择器 标签选择器是最基本的选择器类型，它通过 HTML 元素标签名来选取元素。例如：

p {
color: red;
}

这段 CSS 代码会将所有 <p> 元素的文本颜色设置为红色。

2. 类选择器 类选择器可以通过 HTML 元素的 class 属性来选取元素。类选择器以点号（.）开头，后面跟着类名。例如：

.my-class {
font-size: 18px;
}

这段 CSS 代码会将所有 class="my-class" 的元素的字体大小设置为 18px。

3. ID 选择器 ID 选择器可以通过 HTML 元素的 id 属性来选取元素。ID 选择器以井号（#）开头，后面跟着 ID 名称。例如：

#my-id {
background-color: yellow;
}

这段 CSS 代码会将 id="my-id" 的元素的背景色设置为黄色。

4. 属性选择器 属性选择器可以根据 HTML 元素的某个属性值来选取元素。属性选择器使用方括号（[]）来包含属性名和属性值。例如：

a[href="https://www.example.com"] {
color: blue;
}

这段 CSS 代码会将所有 href="https://www.example.com" 的链接的文本颜色设置为蓝色。

5. 组合选择器 组合选择器可以将多个选择器组合在一起来选取元素。例如：

h1, h2, h3 {
font-weight: bold;
}
p.warning {
color: orange;
}

这段 CSS 代码会将所有 <h1>、<h2>、<h3> 元素的字体加粗，并将所有 class="warning" 的 <p> 元素的文本颜色设置为橙色。

总之，CSS 选择器是 Web 开发中非常重要的一个概念，掌握好 CSS 选择器可以让网页开发变得更加简单和高效。同时，还有其他众多的选择器类型和高级用法，可以帮助开发者更好地实现自己的需求。