如何用CSS改变网站字体颜色

CSS让你可以控制你构建和管理的网页上的文本的外观。在本指南中，我们将向您展示如何使用颜色关键字、十六进制颜色代码或RGB颜色数字来更改CSS中的字体颜色。

如何使用CSS样式改变字体颜色

颜色值可以表示为颜色关键字、十六进制颜色数或RGB颜色数。对于这节课，您将需要一个HTML文档来查看CSS更改和一个附加到该文档的单独的CSS文件。我们将具体地看一下段落元素。

使用颜色关键字来改变字体颜色

要更改HTML文件中每个段落的文本颜色，请转到外部样式表和类型p {}。把颜色属性，后跟冒号，例如P {color:}。然后，在属性后面添加颜色值，以分号结尾。在这个例子中，段落文本的颜色改为黑色:

p {
颜色:黑色;
}

使用十六进制值更改字体颜色

使用颜色关键字将文本更改为红色、绿色、蓝色或其他一些基本颜色，将无法提供创建这些颜色不同色调时可能看到的精度。这就是十六进制值的作用。

这个CSS样式可以用来把你的段落涂成黑色，因为十六进制代码#000000翻译成黑色。您甚至可以对该十六进制值使用简写，并将其写成#000，结果相同。

p {
颜色:# 000000;
}

当你需要一种不仅仅是黑或白的颜色时，十六进制值工作得很好。例如，这个十六进制代码让你能够设置一个非常特定的蓝色阴影——一个中等范围的，像石板一样的蓝色:

p {
颜色:# 2 f5687;
}

十六进制工作通过设置RGB(红，绿，蓝)值的颜色单独的十六进制值。这就是为什么里面有信一个通过F除了这些数字0通过9。

每一种颜色，红、绿、蓝，都有自己的两位数值。00最小的值是否可能FF是最高的。颜色以十六进制的RGB顺序列出，所以前两位数字代表红色值，以此类推。

使用RGBA颜色值来改变字体颜色

最后，您可以使用RGBA颜色值来编辑字体颜色。所有现代浏览器都支持RGCA，因此您可以放心地使用这些值，相信它对大多数查看器都有效，但您也可以设置一个简单的后备方案。

这个RGBA值与上面指定的板蓝色相同:

p {
颜色:rgba (86135,1);
}

前三个值设置为红、绿、蓝值，最后一个值设置为透明度alpha值。alpha设置为1表示100%，所以这个颜色没有透明度。如果您将该值设置为十进制数，比如。85，它将转换为85%的不透明度，颜色将略微透明。

如果你想让你的颜色值防弹，复制以下CSS代码:

p {
颜色:# 2 f5687;
颜色:rgba (86135,1);
}

该语法首先设置十六进制代码，然后用RGBA数字覆盖该值。这意味着任何不支持RGBA的旧浏览器都会得到第一个值，而忽略第二个值。

记住，color属性适用于CSS中的任何HTML文本元素，这一点很重要。例如，您可以更改所有链接的颜色。这个例子会让你的链接变成亮绿色:

一个{
颜色:# 16 c616;
}

这也适用于同时使用多个元素。你可以同时设置每个标题级别。例如，这将把你所有的标题元素设置为午夜蓝色:

H1, h2, h3, h4, h5, h6 {
颜色:# 020833;
}

为你的颜色想出十六进制或RGBA值并不总是容易的。大多数网页设计师会使用Photoshop或GIMP等图像编辑程序来生成准确的代码。你也可以在网上找到方便的颜色选择工具，比如这个来自w3学校。

样式化HTML页面的其他方法

字体颜色可以通过外部样式表、内部样式表或HTML文档中的内联样式改变。然而，最佳实践规定您应该使用外部样式表来处理CSS样式。

内部样式表，即直接写在文档“头”的样式，通常只用于小型的单页网站。内联样式应该避免，因为它们类似于我们多年前处理的旧的“字体”标签。这些内联样式使得管理字体样式变得非常困难，因为你必须在每一个内联样式的实例中改变它们。