html - 字体族规则及其解释

Question

我的问题没有任何代码。所以请不要问我。这是一个信息量很大的问题。

我们都知道 CSS font-family 规则。前任

h1{font-family:"Times New Roman", Times, serif;}

现在我明白了声明字体系列的原因是，如果浏览器找不到第一个字体，它将切换到第二个。但是在什么情况下会发生这种情况。字体失败是否与最终用户机器上安装的字体或某些浏览器不提供对特定字体的支持有关？

Answer 1

正如您所说，答案是肯定的，如果某些或其他字体无法加载，上述声明将用作后备。让我解释一下如何。

让我们稍微修改一下您的声明。假设我们有一种网络字体和两种系统字体，所以声明如下

h1 {
   font-family: 'Open Sans', Arial, Helvetica;
}

在这里，我们Open Sans从Google Web Fonts. 因此，在这里，假设 Google 服务器已关闭，或者说用户浏览器太旧而无法理解font-faceor Web Fonts，并且当特定用户请求我的网页时，Open Sans字体将无法呈现，因为它没有被下载，因为服务器是向下，在这种情况下，CSS 将使用Arial，现在如果用户系统没有Arial字体，它将比应用Helvetica。

如果用户没有任何字体，则网站将呈现用户设置的浏览器默认字体。

Answer 2

最明显的情况是缺少第一种字体的系统。万一 Times New Roman 丢失，Times 会被尝试，实际上它也可能会丢失，因此serif将使用浏览器的默认 serif 字体。

但整体情况要复杂得多。CSS Fonts Module Level 3 LC 中的字体匹配算法部分（在这方面比 CSS 2.1 规范更真实，更接近浏览器现实）描述了如何选择字体。

例如，考虑以下规则：

p { font-family: Arial Unicode MS, Arial; font-style: italic }

在这种情况下，将使用 Arial，因为 Arial Unicode MS 没有斜体字体。或者至少这是本书应该发生的事情以及现代浏览器中发生的事情。

文本可能包含主字体中不存在的字符。然后尝试其他字体，以便找到具有该字符的字体。对于给定的情况h1{font-family:"Times New Roman", Times, serif;}，这意味着对于 Times New Roman（或 Times，但如果存在，它可能具有更有限的字符库）中不可用的任何特殊或“外来”字符，serif都将被使用。