@font-face 仍然无法与 Firefox 和 htaccess 一起使用答案

【问题标题】：@font-face still not working with Firefox and htaccess@font-face 仍然无法与 Firefox 和 htaccess 一起使用
【发布时间】：2012-07-22 09:14:52
【问题描述】：

我已经搜索了又搜索了，但我仍然无法弄清楚如何在 Firefox 中加载我的自定义字体。使用@font-face 属性，我在头部有这个：

@font-face {
   font-family: 'MeanTimeMedium';
src: url('http://sweetbacklove.com/fonts/meantimec3-webfont.eot');
src: url('http://sweetbacklove.com/fonts/meantimec3-webfont.eot?#iefix') format('embedded-opentype'),
     url('http://sweetbacklove.com/fonts/MeanTimec3.ttf') format('truetype'),
     url('http://sweetbacklove.com/fonts/meantimec3-webfont.woff') format('woff'),
     url('http://sweetbacklove.com/fonts/meantimec3-webfont.svg#MeanTimeMedium') format('svg');}

因为 Firefox 不接受到其他域的直接链接，所以我将一个 .htaccess 文件放在我的“字体”文件夹中，如下所示：

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

不过，我正在蹲下。如果有人能提供任何见解，将不胜感激。

我的website。字体和 .htaccess 文件托管在装有 IIS 7.0 的 Windows 服务器上的 GoDaddy 上。

谢谢。

【问题讨论】：

标签： css .htaccess font-face

【解决方案1】：

Google Web Fonts API 生成/使用链接标签，放置在 html 头标签中。

<link href='http://fonts.googleapis.com/css?family=Capriola' rel='stylesheet' type='text/css'>

当这个页面被链接到时，它会处理一个 .woff 文件的获取请求，这是一种字体/woff 的 mime 类型。

参考这篇 stackoverflow 文章 CSS @font-face not working with Firefox, but working with Chrome and IE>，您想在 .htaccess 文件中添加以下 Mime 类型。

AddType font/ttf .ttf
AddType font/eot .eot
AddType font/otf .otf
AddType font/woff .woff

您也可以尝试直接链接到字体文件（我没有尝试过）

<link href='http://sweetbacklove.com/fonts/meantimec3-webfont.woff' rel='stylesheet' type='font/woff' media='all'>

【讨论】：