3

我们刚刚开始使用 Amazon Cloudfront 的 CDN 来加载我们的文件，但我们无法在 Firefox 中加载 @font-face 字体。根据一些建议，我们在 htaccess 文件中添加了以下代码，但似乎并没有解决问题。

<FilesMatch "\.(ttf|ttc|otf|eot|woff)$">
  <IfModule mod_headers.c>
    Header set Access-Control-Allow-Origin "*"
  </IfModule>
</FilesMatch>

字体有时会出现，但我们仍然会在控制台中看到每种字体的错误。您可以在http://wiredimpact.com上查看。

另外，我用来了解这个的主要 WordPress 帖子是http://wordpress.org/support/topic/plugin-w3-total-cache-font-face-not-working-in-firefox?replies=21。

关于如何让字体正确加载到 Firefox 中的任何建议？

谢谢。

编辑：

我将 htaccess 中使用的代码调整为：

<FilesMatch "\.(ttf|ttc|otf|eot|woff|font.css)$">
  <IfModule mod_headers.c>
    Header set Access-Control-Allow-Origin "*.wiredimpact.com"
  </IfModule>
</FilesMatch>

这不仅添加了 font.css 文件，这在 Firefox 中似乎有帮助，而且它也只从我们的子域加载，这对安全目的更好。字体现在似乎正在 Firefox 中加载，但错误仍然显示在控制台中。

4

1 回答 1

0

正如icoMoon 字体中所述，@meaganoff 不会在 Firefox 上显示：

我也遇到了 icomoon 和 Firefox 的问题。您是否尝试过 Paul Irish 的“防弹”@font-face语法？它与 icomoon 的输出有点不同，而且我的运气更好——从那以后就没有 FF 问题了。

@font-face {
    font-family: 'Graublau Web';
    src: url('GraublauWeb.eot?') format('eot'), url('GraublauWeb.woff') format('woff'), url('GraublauWeb.ttf')

格式（'truetype'）；}

并且像魅力一样工作！

于 2013-11-19T21:50:36.670 回答