在这一快速教程中，我们将为您展示如何使用CSS和HTML 标签、ID或类（Class）为任何HTML文字元素设置颜色。如果您对CSS样式还不熟悉，可查看我们关于CSS颜色入门的教程，请看这里。
CSS文字颜色使用HTML标签
首先，让我们来设计一些基础文字。在这一示例中我们会使用<h1>标签，但您可以使用CSS对任何文字元素进行设计。以下是我们的示例HTML文件，一个非常简单的页面，只包括一个标题和一个比较短的小节。
<!-- HTML -->
<head>
</head>
<body>
<h1>Title</h1>
<p>Some paragraph text.</p>
</body>我们来将<h1>元素设为红色。我们将在HTML文件的<head>添加一个<h1>元素的CSS样式，将颜色从默认的黑色改为红色。
<!-- HTML -->
<head>
<style>
h1 { color: #FF0000; }
</style>
</head>
<body>
<h1>Title</h1>
<p>Some paragraph text.</p>
</body>CSS文字颜色使用ID
另一种设计<h1>元素的方式是赋予它一个ID；在这个示例中，我们将使用'heading'这个ID。ID能够使用CSS进行设计，方法与HTML标签相同，但是以'#'符号为前缀。
<!-- HTML -->
<head>
<style>
#heading { color: #FF0000; }
</style>
</head>
<body>
<h1 id="heading">Title</h1>
<p>Some paragraph text.</p>
</body>CSS文字颜色使用类（Class）
为HTML元素添加颜色的第三种方法是使用类（Class）― 与ID非常相似，除了它们的前缀是一个点'.'而不是'#'。这里我们对<h1>元素采用相同的CSS颜色，但使用名为'heading'的类。
<!-- HTML -->
<head>
<style>
.heading { color: #FF0000; }
</style>
</head>
<body>
<h1 class="heading">Title</h1>
<p>Some paragraph text.</p>
</body>