Question

所以跨浏览器@ font-face解决方案似乎需要多个HTTP请求。这是我能找到的最好的代码：

@font-face {
  font-family: 'Graublau Web';
  src: url('GraublauWeb.eot');
  src: local('Graublau Web Regular'), local('Graublau Web'),
    url("GraublauWeb.woff") format("woff"),
    url("GraublauWeb.otf") format("opentype"),
    url("GraublauWeb.svg#grablau") format("svg");
}

就此而言，我最好只使用Javascript还是会减慢加载时间？我的加载速度的最终解决方案（以及因此SEO，这是我的首要任务）是否将使用图像？

谢谢！

Answer 1

浏览器只会根据该规则进行一次连接和一次下载。该规则并不告诉浏览器下载所有指定的字体 - 这没有意义。相反，它告诉浏览器下载它找到的第一个指定字体。

该行：

src: url('GraublauWeb.eot');

是一个单独的规则，因为行目标（IE）的浏览器不支持备用字体列表。这利用了浏览器将忽略他们不理解的css规则的事实。

如果必须调用多个文件，font-face是否值得？

1 个答案: