html class

作者：天辰皇族发布日期:2025-05-06 浏览:30

<!DOCTYPE html>
<html>
<head>
    <title>HTML Class Example</title>
    <style>
        /* 使用类选择器来设置样式 */
        .highlight {
            background-color: yellow;
            font-weight: bold;
        }
        .important {
            color: red;
            font-size: 20px;
        }
    </style>
</head>
<body>

    <!-- 使用 class 属性为元素添加类 -->
    <p class="highlight">这段文字有黄色背景并且加粗。</p>
    <p class="important">这段文字是红色并且字体较大。</p>
    <p class="highlight important">这段文字既有黄色背景和加粗，又是红色且字体较大。</p>

</body>
</html>

解释说明：

类选择器：在 CSS 中使用 . 来定义类选择器。例如 .highlight 和 .important。
HTML class 属性：通过在 HTML 元素中使用 class 属性来应用这些类。可以为一个元素指定多个类，用空格分隔。
样式效果：
- .highlight 类设置了黄色背景和加粗字体。
- .important 类设置了红色文本和较大的字体。
- 当一个元素同时拥有多个类时（如第三个 <p> 标签），它会同时应用所有类的样式。

上一篇：html居中标签

下一篇：padding在html是什么意思