html 文字颜色

作者：嗜神魔影发布日期:2026-06-02 浏览:94

<!DOCTYPE html>
<html>
<head>
    <title>HTML 文字颜色示例</title>
    <style>
        /* 使用 CSS 设置文字颜色 */
        .red-text {
            color: red;
        }
        .blue-text {
            color: blue;
        }
        .green-text {
            color: green;
        }
    </style>
</head>
<body>
    <!-- 使用内联样式设置文字颜色 -->
    <p style="color: orange;">这是一个橙色的文字。</p>

    <!-- 使用类选择器设置文字颜色 -->
    <p class="red-text">这是一个红色的文字。</p>
    <p class="blue-text">这是一个蓝色的文字。</p>
    <p class="green-text">这是一个绿色的文字。</p>

    <!-- 使用 HTML 标签属性设置文字颜色（不推荐，但仍然有效） -->
    <p><font color="purple">这是一个紫色的文字。</font></p>
</body>
</html>

解释说明：

内联样式：直接在 HTML 标签中使用 style 属性来设置文字颜色。例如 <p style="color: orange;">。
类选择器：通过定义 CSS 类（如 .red-text），然后在 HTML 中应用这些类来设置文字颜色。这种方式更灵活且易于维护。
HTML 标签属性：使用 <font> 标签的 color 属性来设置文字颜色，但这是一种过时的方法，不推荐使用。

希望这个示例能帮助你理解如何在 HTML 中设置文字颜色。

上一篇：html取色器

下一篇：html文字颜色