如何使用 FontFace API 加载后备字体格式答案

【问题标题】：How to load fallback font formats with FontFace API如何使用 FontFace API 加载后备字体格式
【发布时间】：2017-04-25 00:02:43
【问题描述】：

当使用 FontFace API（不是 @fontface）时，是否有一种方便的方法可以传递多种不同的字体格式，例如在 @fontface 中提供多个来源？

或者，是否有一种方便的方法来检查使用 FontFace API 的浏览器将接受哪些格式，以便我可以提供几种最理想的格式？

【问题讨论】：

标签： javascript css fonts font-face webfonts

【解决方案1】：

根据CSS Font Loading 规范的当前草案所述，FontFace API 采用与相应的@font-face 描述符相同的值。这意味着您可以简单地将您在@font-face 定义中使用的任何后备字符串作为字体数据源传递。 It’s how WebKit handles it，无论如何：

let fontFace = new FontFace("MyWebFont", "url('MyWebFont.woff2') format('woff2'), url('MyWebFont.woff') format('woff')");

【讨论】：

在仔细检查规范后更新了答案，该规范确实非常清楚地表明字体源参数遵循@font-face 后备语法。
这出乎意料地直截了当。 Mozilla 文档在显示这一点方面做得很差，从规范中我不会猜到这个文本后备参数。感谢分享！
没错，像 WebKit 博客上的一个简单示例将使 W3C 规范更有帮助。现在我不得不仔细阅读规范，以注意到他们明确表明情况确实如此的部分。