Html @字体脸可以在Chrome中使用，但不能在IE或Firefox中使用

这让我很困惑。我正在使用FontSquirrel下载一个web工具包来显示自定义字体。以下是指向字体的链接：

如果您现在查看主页：

中间的主语是说“定制的网站是为了让你有更多的客户”。它在chrome中看起来很棒，这是它应该有的，但是如果你在firefox或IE中看到它，定制字体就不起作用了

以下是生成字体的CSS：

@font-face {
font-family: 'LeagueGothicRegular';
src: url('http://simonsayswebsites.com/wp-content/themes/twentytenchild/League_Gothic-webfont.eot');
src: url('http://simonsayswebsites.com/wp-content/themes/twentytenchild/League_Gothic-webfont.eot?#iefix') format('embedded-opentype'),
     url('http://simonsayswebsites.com/wp-content/themes/twentytenchild/League_Gothic-webfont.woff') format('woff'),
     url('http://simonsayswebsites.com/wp-content/themes/twentytenchild/League_Gothic-webfont.ttf') format('truetype'),
     url('http://simonsayswebsites.com/wp-content/themes/twentytenchild/League_Gothic-webfont.svg#LeagueGothicRegular') format('svg');
font-weight: normal;
font-style: normal;

}

---

有人有什么想法吗？我看了很多关于这一切都准备好了的案例，但我没有看到一个与我的案例相关，因为我认为我已经包含了每个浏览器所需的所有不同文件，并将它们上传到了它们受人尊敬的地方。

翻阅一下，我发现Firefox有一个有趣的小贴士：

同源规则：默认情况下，Firefox只接受相对链接。如果要使用绝对链接或包含来自不同域的字体，则需要发送带有访问控制标题的字体

尝试将这些字体URL更改为相对，看看是否有帮助：

---

编辑：参见Korpela的答案；问题是与“www”子域不匹配。不过，您可能应该保持URL的相对性。

在浏览Firefox时，我发现了一个有趣的小贴士：

同源规则：默认情况下，Firefox只接受相对链接。如果要使用绝对链接或包含来自不同域的字体，则需要发送带有访问控制标题的字体

尝试将这些字体URL更改为相对，看看是否有帮助：

---

编辑：参见Korpela的答案；问题是与“www”子域不匹配。不过，您可能应该保持URL的相对性。

问题的原因是跨域使用字体。开始的URL“http://simonsayswebsites.com“被视为位于不同于的域中”http://www.simonsayswebsites.com“即使这两个域名可能指的是同一台计算机

切换到相对URL会有所帮助，因为域是相同的。但尽管有相反的传言，Firefox并没有拒绝

@font-face

中的绝对URL。我已经建立了一个小程序来展示这一点

---

据推测，谣言源于这样的情况：如果切换到相对URL有帮助，那么很自然会认为URL的类型是问题所在。

问题的原因是跨域使用字体。开始的URL“http://simonsayswebsites.com“被视为位于不同于的域中”http://www.simonsayswebsites.com“即使这两个域名可能指的是同一台计算机

切换到相对URL会有所帮助，因为域是相同的。但尽管有相反的传言，Firefox并没有拒绝

@font-face

中的绝对URL。我已经建立了一个小程序来展示这一点

---

据推测，谣言来自这样的案例：如果切换到相对URL有帮助，那么很自然地会认为URL的类型是问题所在。

我也有你的问题，搜索了很多关于它的信息，但什么都没有找到。。。 因此，我开始在CSS上试验了几分钟，最终意识到我复制了字体系列名称，我在我的主题和布局页面中声明了以下代码：

<style type="text/css" media="screen, print">
    @font-face 
    {
        font-family: 'foo';
        src: url('~/Assets/fonts/foo.woff') format('woff'),
        url('~/Assets/fonts/foo.ttf') format('truetype'),
        url('~/Assets/fonts/foo.eot') format('eot');
    }
</style>

@字体
{
字体系列：“foo”；
src:url（'~/Assets/fonts/foo.woff'）格式（'woff'），
url（“~/Assets/fonts/foo.ttf”）格式（'truetype'），
url（'~/Assets/fonts/foo.eot'）格式（'eot'）；
}

我只需要删除其中一个，我的代码在所有三个浏览器中都运行良好

---

还有一点是，只要删除包含“font-family:'foo'；”部分的行就可以了

我也有你的问题，找了很多，但什么也没找到。。。 因此，我开始在CSS上试验了几分钟，最终意识到我复制了字体系列名称，我在我的主题和布局页面中声明了以下代码：

<style type="text/css" media="screen, print">
    @font-face 
    {
        font-family: 'foo';
        src: url('~/Assets/fonts/foo.woff') format('woff'),
        url('~/Assets/fonts/foo.ttf') format('truetype'),
        url('~/Assets/fonts/foo.eot') format('eot');
    }
</style>

@字体
{
字体系列：“foo”；
src:url（'~/Assets/fonts/foo.woff'）格式（'woff'），
url（“~/Assets/fonts/foo.ttf”）格式（'truetype'），
url（'~/Assets/fonts/foo.eot'）格式（'eot'）；
}

我只需要删除其中一个，我的代码在所有三个浏览器中都运行良好

---

还有一点是，只要删除包含“font-family:'foo'；”部分的行就可以了

我在Firefox中看到“LeagueGothicRegular”。问题是url的显示方式。。。你不能有绝对的url的任何原因lol。但谢谢你的链接谢克，它提供了一个很好的背景，我必须在未来做什么。谢谢你的建议，阿拉什，谢天谢地我现在一切都好了。我在Firefox中看到了“Leaguegothicrular”。问题是url的显示方式。。。你不能有绝对的url的任何原因lol。但谢谢你的链接谢克，它提供了一个很好的背景，我必须在未来做什么。谢谢你的建议，阿拉什，谢天谢地我现在一切都好了。。。太棒了，伙计。。。成功了！！！疯子非常感谢你在这方面的帮助。。。想不到就这么简单。哈哈。。。太棒了，伙计。。。成功了！！！疯子非常感谢你在这方面的帮助。。。想不到这么简单。啊，很好的捕捉，我完全错过了他在字体定义中没有使用“www”。这是有道理的。。。我感谢你的详尽解释啊，很好的理解，我完全没有意识到他在字体定义中没有使用“www”。。。我感谢你的详尽解释