css多个class共用写法

作者：半世苍凉发布日期:2025-03-28 浏览:86

/* 示例代码：多个class共用写法 */

/* 1. 多个元素共用相同的样式 */
.common-class {
    color: blue;
    font-size: 16px;
}

/* 2. 使用逗号分隔多个选择器，使它们共享相同的样式 */
.class1, .class2, .class3 {
    background-color: yellow;
    padding: 10px;
}

/* 3. 组合使用类选择器，适用于需要同时应用多个类的元素 */
<div class="class1 class2">这个元素既有 class1 的样式也有 class2 的样式</div>

/* 解释说明：
- 第一种方式是定义一个通用的类（如 .common-class），然后在 HTML 中为需要该样式的元素添加这个类。
- 第二种方式通过逗号分隔多个类选择器，使得这些类都共享相同的样式规则。
- 第三种方式是在 HTML 中为一个元素同时添加多个类，从而组合使用不同的样式。
*/

上一篇：css设置背景图片大小自适应

下一篇：css显示滚动条