CSS 如何更改字体和颜色

在前端开发中，我们常常需要更改网页中的字体和颜色，让网站更加美观和易读。CSS（层叠样式表）是用于控制网页样式的语言，下面将介绍如何使用CSS更改字体和颜色。

字体样式

我们可以使用 font-family 属性来设置字体样式。这个属性接受一个由字体名字构成的列表作为值，这些字体名字可以是字体的名称、引用资源的 URL 、以及一个逗号分隔的字体族名称列表。如果名称中有空格，需要使用引号将其括起来。

p {
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

上述代码表示 p 元素应该使用 'Helvetica Neue' 字体，如果该字体不可用，则使用 Helvetica 字体，如果 Helvetica 也不可用，则使用 Arial 字体，最后使用 sans-serif 作为后备字体。我们通常建议使用通用字体作为最终后备字体，如 sans-serif、serif 或 monospace。

我们也可以使用 font-size 属性来控制字体大小。该属性指定字体的大小，其值可以是像素、EM(相对于当前元素字体的大小) 或百分比。

p {
  font-size: 16px;
}

上述代码表示 p 元素的字体大小为 16 像素。

此外，我们还可以使用 font-weight 和 font-style 属性来控制字体的粗细和样式。例如：

p {
  font-weight: bold;
  font-style: italic;
}

上述代码表示 p 元素的字体加粗和斜体。

字体颜色

我们可以使用 color 属性来设置字体颜色。该属性接受一个表示颜色的值，可以使用颜色名、RGB 值、HEX 值或 HSL 值。

p {
  color: red;
}

上述代码表示 p 元素的字体颜色为红色。

总结

以上是使用 CSS 更改字体和颜色的基本步骤。通过设置 font-family、font-size、font-weight 和 font-style 属性，我们可以控制字体样式；通过设置 color 属性，我们可以控制字体颜色。