为什么 font-awesome 不能在 web 上工作而在 localhost 上工作？答案

【问题标题】：Why font-awesome does not work on web and work in localhost?为什么 font-awesome 不能在 web 上工作而在 localhost 上工作？
【发布时间】：2013-05-06 00:04:09
【问题描述】：

为什么 font-awesome 在 localhost 上有效，但在 web 上无效？

请帮忙！！

@font-face {
  font-family: 'FontAwesome';
  src: url('font/fontawesome-webfont.eot@v=3.0.1');
  src: url('font/fontawesome-webfont.eot@#iefix&v=3.0.1') format('embedded-opentype'),
    url('font/fontawesome-webfont.woff@v=3.0.1') format('woff'),
    url('font/fontawesome-webfont.ttf@v=3.0.1') format('truetype');
  font-weight: normal;
  font-style: normal;
}

【问题讨论】：

你检查文件名的大小写，Linux是区分大小写的。
是的，我查过了。我正在使用 Windows 服务器
你确定你已经上传了很棒的字体文件吗？
我很确定

标签： internet-explorer google-chrome firefox fonts font-awesome

【解决方案1】：

我从here 找到了解决此问题的方法：一个叫 Thorst 的人在页面的一半左右回答了这个问题。

为我节省了很多挫败感！

万一链接失效->

更改 font-awesome.css

发件人：

src: url('../font/fontawesome-webfont.eot?#iefix') format('eot'),
 url('../font/fontawesome-webfont.woff') format('woff'),
 url('../font/fontawesome-webfont.ttf') format('truetype'),
 url('../font/fontawesome-webfont.svg#FontAwesome') format('svg');

收件人：

 src: url('../font/fontawesome-webfont.eot?#iefix')
 format('embedded-opentype'), url('../font/fontawesome-webfont.woff')
 format('woff'), url('../font/fontawesome-webfont.ttf')
 format('truetype'), url('../font/fontawesome-webfont.svg#FontAwesome')
 format('svg');

*注意：eot 的格式已更改。

【讨论】：

【解决方案2】：

如果您的字体真棒文件与您的网页位于不同的服务器上，您的浏览器中可能会出现 CORS（跨源资源共享）错误。您可以使用 MaxCDN 服务器或修改您的服务器（提供字体真棒文件）以在字体文件中包含 Access-Control-Allow-Origin:* 标头。请参阅我对Font Awesome icons not showing in Chrome, a MaxCDN related Cross-Origin Resource Sharing policy issue的回答

【讨论】：

【解决方案3】：

我从未见过@ 这样的标志。尝试在他们的位置使用问号：

@font-face {
  font-family: 'FontAwesome';
  src: url('font/fontawesome-webfont.eot?v=3.0.1');
  src: url('font/fontawesome-webfont.eot?v=3.0.1#iefix') format('embedded-opentype'),
    url('font/fontawesome-webfont.woff?v=3.0.1') format('woff'),
    url('font/fontawesome-webfont.ttf?v=3.0.1') format('truetype');
  font-weight: normal;
  font-style: normal;
}

在第 4 行，我还交换了 #iefix 和 v=3.0.1 的顺序，并删除了 &。

【讨论】：