CSS 选择器

CSS 选择器

CSS 选择器用于”查找”或选择要设置样式的 HTML 元素。

CSS 选择器分类

CSS 选择器可分为五类：

1. 简单选择器（根据名称、id、类选择元素）
2. 组合选择器（根据元素之间的关系选择）
3. 伪类选择器（根据特定状态选择）
4. 伪元素选择器（选择元素的一部分）
5. 属性选择器（根据属性或属性值选择）

元素选择器

元素选择器根据元素名称选择 HTML 元素：

p {
    text-align: center;
    color: red;
}

ID 选择器

ID 选择器使用 # 号加上元素的 id 属性：

#intro {
    text-align: center;
    color: green;
}

<p id="intro">这是一段介绍文字。</p>

类选择器

类选择器使用 . 号加上类名：

.center {
    text-align: center;
    color: blue;
}

<p class="center">这段文字居中显示。</p>

通用选择器

通用选择器 * 选择页面上的所有元素：

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

分组选择器

分组选择器用于选择具有相同样式的多个元素：

h1, h2, p {
    text-align: center;
    color: navy;
}