Question

Paul Irish建议加载字体的'防弹'方式是首先渲染EOT，然后是WOFF，TTF，最后是SVG。

@font-face {
  font-family: 'Tagesschrift';
  src: url('tagesschrift.eot'); /* IE 5-8 */ 
  src: local('☺'),             /* sneakily trick IE */
        url('tagesschrift.woff') format('woff'),    /* FF 3.6, Chrome 5, IE9 */
        url('tagesschrift.ttf') format('truetype'), /* Opera, Safari */
        url('tagesschrift.svg#font') format('svg'); /* iOS */
}

来源：http://www.html5rocks.com/en/tutorials/webfonts/quick/

然而，他没有解释为什么这是正确的顺序（我假设表现）。谁能详细说明？另外，质量差异是什么？例如。 SVG似乎可以在Chrome中产生更好的缩放/抗锯齿效果。

Answer 1

没有“正确的顺序”，它不是一个加载顺序，而是一个列表，每个浏览器都希望从中获取一个要加载的字体资源 - 即它们支持的第一个（并且它以这种方式工作）。

EOT首先是因为它是旧版本IE支持的唯一一个，但它的位置并不重要。

WOFF通常被认为是网络字体的最佳选择。这是否真实可能取决于意见，渲染例程和字体，但它无论如何是订单背后的传统智慧

最后列出了TTF和SVG，因为某些浏览器仅支持此类格式。如果它们被放置得更早，那些格式也可能被支持WOFF的一些浏览器使用。

加载字体的正确顺序是什么？

1 个答案: