如何更改网页上的字体类型、大小和颜色

文章插图
此页面包含有关如何更改 HTML（超文本标记语言）网页上的字体及其颜色的说明。随着HTML5的引入，现在配置网页字体的正确方法是使用CSS（层叠样式表）。使用内联样式属性或字体标签的旧方法已被弃用，不应再使用。
笔记尽管已弃用的方法仍然可以在现代 Internet 浏览器中正确呈现，但不再保证它们能够这样做。要创建能够正确显示最多用户数量的网页，请使用本页描述的 CSS 方法。
提示更改此页面上的字体属性的方法适用于大多数 HTML 标记中包含的文本，包括<>、<p>和<span> 。这些方法也适用于使用<table>、<tr>和<td>标记的表中的文本。

将 CSS 用于单个应用程序。
对一页或多页使用 CSS 。
使用字体标签。

将 CSS 用于单个应用程序如果您计划更改网页上的一个单词、句子或段落的字体及其颜色，请在元素标记中配置其属性。使用style属性，您可以使用font-family、color指定字体和颜色，并使用font-size指定字体大小，如下例所示。
示例代码<p style="font-family:Courier; color:Blue; font-size : 20px;">该文本的字体为 Courier ，蓝色， 20px 。</p>结果该文本采用 Courier 字体，为蓝色，大小为 20 像素。
对一页或多页使用 CSS一页的自定义字体在网页的头部，您可以在 <style></style> 选项卡之间插入代码，以更改各种元素中文本的外观。下一个蓝色框包含示例代码，一旦调用，会将您的字体更改为 Courier 并将其设置为红色。正如您所看到的，我们已将类名称定义为“custom” 。
<样式类型=“文本/css”> 。风俗 { 字体系列：Courier；红色; 字体大小：20px；}</风格>定义后，通过将“custom”类附加到页面中的大多数元素，可以将此样式应用于它们。下面的框显示了两行代码及其各自的结果。
例子<p class="custom">这整句话都是红色和Courier的</p><p>只有单词<span class="custom">test</span>是红色和Courier 。</p>结果【如何更改网页上的字体类型、大小和颜色】这整句话都是红色的和快递的。
只有“test”两个字是红色的和“Courier” 。
许多页面的自定义字体导入外部 CSS 文件非常有用，因为它允许用户同时更改多个页面的规则。以下部分显示了创建基本 CSS 文件的示例，该文件可更改大多数元素的字体及其颜色。该文件可能被加载到多个网页，甚至整个站点。
使用任何基本文本编辑器，将以下文本保存为 .css 文件将为导入做好准备。
@charset“utf-8”；。导游 { 字体系列：Courier；颜色：#005CB9；}将前面的文本放入 .css 文件（我们将其命名为basic.css）后，您可以使用类似于以下示例的行从任何其他页面链接到它。
<link rel="stylesheet" Type="text/css" href="http://www.example.com/basic.css">提示用户可以通过更改导入的 .css 文件中的代码来更改页面上元素的属性。
使用字体标签尽管已弃用，但HTML <font> 标记仍然可以使用，并且可能需要与某些在线服务一起使用。使用 font 标签时，必须包含face属性，它描述了要使用的字体。在下面的示例中，我们使用 Courier 字体和十六进制颜色代码 #005CB9 ，它是深蓝色。
示例代码<font color="#005CB9" face="courier" size="5">特殊字体示例。</font>结果特殊字体示例。