如果用户没有安装例如 helvetica，如何回退到谷歌网络字体

Posted 2023-02-16

【中文标题】如果用户没有安装例如 helvetica，如何回退到谷歌网络字体

【英文标题】：How to fall back to a google web font if the user doesn't have eg helvetica installed

【发布时间】：2012-01-25 02:35:55

【问题描述】：

如果用户没有安装 helvetica，我希望一种字体“回退”到谷歌网络字体（Open Sans）上的某个字体，有没有一种简单的方法可以做到这一点？

我的想法是，我只希望用户必须下载字体，例如，对于 mac 用户，我不希望他们必须下载字体。

例如，如果可能的话，像这样：

font-family: HelveticaNeue-Light, 'Open Sans Light', Arial;

另外，由于我使用的是 helvetica 'Helvetica Neue Light' 的特定轻型版本，当退回到 open sans / arial 时，是否有一种方法可以指定字体粗细，使粗细仅适用于后备字体？以下是这样做的吗？

h1  font-family: HelveticaNeue-Light, Arial; font-weight: 400; 

【问题讨论】：

如果您使用 Google Font API，它应该为您执行此操作...即。告诉 API 包含它，它应该确定用户是否有字体

但由于许可，谷歌网络字体不包括 helvetica，所以我希望它在另一个重量上落入另一种字体。容易吗？

【参考方案1】：

您可以在@font-face src property 中指定字体的本地路径，这样已经拥有该字体的客户端就不会从备用源下载它。我不知道它在浏览器中的支持情况如何，但它应该适用于任何支持字体的浏览器。

@font-face 
  font-family: Helvetica;
  src: local(Helvetica), url(/path/to/Helvetica.ttf);

【讨论】：

这会允许它退回到打开的sans（或其他字体）吗？我的意思是，我不能简单地将 helvetica 上传到我的网站...

是的，只需在url() 中指定任何字体，如果它们在本地没有指定的字体，将使用该字体。