如何使用 CSS 创建类？

在 CSS 中，通过类（class）可以给 HTML 元素添加样式。

创建类

要创建类，可以使用以下语法：

.class-name {
  /* CSS 属性 */
}

其中，.class-name 表示类名，可以自定义。在 HTML 中，可以通过 class 属性将该类应用到某个元素上，例如：

<div class="class-name">这是一个元素</div>

类的优先级

当一个元素同时应用了多个类时，CSS 的优先级规则会决定哪个类的样式会被应用。

通常情况下，按照以下顺序来判断类的优先级：

1. !important 声明的样式
2. 行内样式（style 属性）
3. ID 选择器
4. 类选择器
5. 标签选择器
6. 通用选择器（*）

例如，在以下示例中，.class-a 的样式会被 .class-b 的样式覆盖：

.class-a {
  color: red;
}

.class-b {
  color: blue;
}

<div class="class-a class-b">这是一个元素</div>

继承和覆盖

CSS 的类样式也可以继承和覆盖。当一个元素继承了某个类的样式时，可以通过另外一个类来覆盖这些样式。

例如，在以下示例中，blue-text 类覆盖了 red-text 类的样式：

.red-text {
  color: red;
}

.blue-text {
  color: blue;
}

<div class="red-text blue-text">这是一个元素</div>

总结

类是 CSS 中一种重要的选择器，可以方便地给多个元素应用相同的样式。在使用时，需注意类的优先级规则，同时也可以通过继承和覆盖实现更灵活的样式控制。