By 时代数字趋势2021-06-16

Font Stack是CSS font-family的一个字体清单，以使用者满意度来排序。Font Stack支援网页字体设定，因此无需透过电脑安装。

• Font Stack语法
  • 字体名称用逗号隔开
  • 多个字组成的字体名称要用引号标注
  • 单一Font Stack通常以一个通用的字体来分类（比如有衬线或无衬线）
• Font Stack和网络字体
• 排版设计中的CSS

Font Stack语法

那么，Font Stack的语法是长什么样子呢? 下面举一个例子。body {
font-family:Georgia, "Times New Roman", serif;
}

使用Font Stack语法时有些需要注意的事项。

字体名称用逗号隔开

你可以添加任意字体，注意字体间用逗号隔开即可。浏览器一般都会尝试载入首个字体，若首个字体载入失败，则开始载入第二个，依次类推，直到浏览器找到能成功载入的字体为止。

操作原理就是使用网络安全字体，网站访问者的电脑很可能有Georgia字体。如果没有，浏览器将载入下一个字体”Times New Roman”。

多个字组成的字体名称要用引号标注

诸如Times New Roman、Trebuchet MS、Courier New等字体需要双引号，以便浏览器知道每个字体名称中的英文字是一起的。

单一Font Stack通常以一个通用的字体来分类（比如有衬线或无衬线）

在这种情况下，载入有衬线字体会告诉浏览器，如果Font Stack中的特定字体不可用，那么至少要使用属于这个类别的字体。

例如，如果你正在使用无衬线字体，例如Arial和Verdana字体，无衬线字体分类会是确定载入选项。至少当你指定的字体不能使用时，下一个被载入使用的字体至少属于这个类别。

Font Stack和网络字体

如今，网站所使用的网络字体要么与其他资源，像是图片、Javascript文件等一起包含在网站上，要么是连结到一个字体库，比如Google Fonts或Typekit。

儘管这些字体的载入应该没有任何问题，但使用Font Stack确实比使用这些外接网站要更稳定。

网络安全字体也是同理，这些字体大多都已经安装在电脑操作系统中，像是这篇提过的所有字体都属于网络安全字体。

儘管可能性很低，但为了防止网站字体丢失，指定一个Font Stack更方便网站设计排版。

排版设计中的CSS

一般网页设计师或网站开发人员都很喜欢网站里放各种图片，当然使用者也喜欢有许多图片的网站，因为看起来很丰富。

但对于搜寻引擎来说，它们更依赖爬寻书面文字，因此网页排版设计极为重要，我们需要确保网站既具备吸引力，也能让搜寻引擎容易索引和读取。

因此在现代网页设计中，都会使用CSS(阶层式样式表)来实现管理网站样是，并搭配HTML的网页结构来开发网站。