何时下载备用字体？ [英] When is a fallback font downloaded?

问题描述

如果我将Google字体设置为备用字体，如下所示：

@font-face {
    font-family: 'GoogleFont';
    src: url('GoogleFont.ttf');
}

html, body {
    font-family: 'myMainFont', 'GoogleFont';
}

如果主字体失败，Google字体是否仅下载到用户的浏览器？

推荐答案

否：浏览器实现各不相同，因此您不能相信字体会被忽略(即使不需要它们)。

客户端的操作系统、浏览器和版本都会导致不同的性能--浏览器可能提供的其他设置也是如此。请参阅Adam's answer关于W3的"规则"的浏览器遵从性。

在不同的浏览器中查看下载到您的浏览器here和here中的资源，以了解如何处理字体。

---

话虽如此，according to the MDN documentation如果您在@font-facesrc属性中指定了多个文件，就可以拥有您想要的"回退"行为：

@font-face {
  font-family: MyFontName;
  src: url("MyMainFont.tff"), url("MyBackupFont.ttf");
}

在this example中，如果找不到第一个文件，则向下继续src列表，直到找到有效文件。因此，只有在找不到MyMainfont.tff的情况下才会下载MyBackupFont.tff。您还可以使用local("FontName")在src中指定本地文件。

---

顺便提一下，Chris has a great article关于如何"负责任地使用[@Font-Face]"

这篇关于何时下载备用字体？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！