Question

我正在尝试在导航中使用一些字体真棒图标。每个列表项旁边只有一些简单的向下箭头。如果我链接到Font Awesome CDN，它工作正常，每当我尝试在本地复制文件并将它们上传到我的服务器时，我只是得到方框。我很确定我的所有路径都是正确的，只是无法弄清楚我哪里出错了。

http://builderpreviews22.com/

感谢任何帮助。

Answer 1

如果您使用的是sass或scss，请确保字体库的路径是相对于已编译的css文件而不是_variables.scss文件。

Answer 2

您网站中的网络错误500 ：

"NetworkError: 500 Internal Server Error - http://builderpreviews22.com/font-awesome/fonts/fontawesome-webfont.ttf?v=4.0.3"

当浏览器尝试加载不存在的内容时会发生这种情况，在本例中为fontawesome-webfont.ttf。

您的CSS中有一个获取fontawesome-webfont.ttf?=4.0.3文件的属性：

url('../fonts/fontawesome-webfont.woff?v=4.0.3')

检查font-awesome文件夹中是否包含该文件。

Answer 3

在部署到生产环境时，我的MVC项目也会发生这种情况。

src: url('../fonts/fontawesome-webfont.eot?v=4.0.3');

将其更改为

src: url('../../Content/fonts/fontawesome-webfont.eot?v=4.0.3');

Answer 4

在web.config中注册mime类型是不够的。实际上解决方案是愚蠢的：在 web.config 中注册mime类型后，应用程序将查找 .woff 和 .eot 文件扩展名。您的案例中的文件扩展名实际上是 .eot？v = 4.0.3 。只需将文件重命名为 .eot 和 .woff ，并通过删除版本替换其他css文件中的包含，它将像魅力一样工作：D：）

Answer 5

如果所有路径都正确，请确保您的静态文件服务器已启用CORS并设置Access-Control-Allow-Origin标头。希望能帮助别人！

字体真棒图标没有出现

5 个答案: