一些 Font Awesome 图标无法显示。

Question

我能看到icon-screenshot和icon-map-marker被正确渲染，但是使用icon-paper-clip、icon-group或者icon-link时什么都看不到……可能是什么问题呢？这里有人遇到过同样的问题吗？

- Adnan Memon

---

可能您有其他的CSS覆盖了Font Awesome的代码。使用它们的最新版本肯定可以显示这些图标。也许您可以向我们展示您的自定义CSS？ - Jan

对我来说运行良好 :) http://jsfiddle.net/handtrix/s5pxe/ - HaNdTriX

谢谢，伙计们 - 原来当我升级到第3版时没有使用更新的字体文件。 - Adnan Memon

Answer 1

根据官方故障排除指南，这些是您应该检查的事项：

一般

• 您的系统上没有安装旧版本的 Font Awesome（可能具有优先级）；
• [如果您从自己的服务器提供 Font Awesome] 您的 font-awesome.css 文件和 /fonts 文件夹都是最新的；
• [如果您从 CDN 提供 Font Awesome] 您的 css 链接是最新的；
• 您没有使用加载旧版本/修改版本的 Font Awesome 的插件/扩展程序；
• 您正在使用有效的 HTML5 模板；
• 您的浏览器开发控制台显示您正在加载正确的字体文件；
• 您的浏览器扩展程序没有阻止 web 字体（noscript、adblockplus 等）。

IE 特定

• Internet Explorer 兼容模式可能会导致一些问题。通过添加以下内容到头部来禁用它：

  <meta http-equiv="X-UA-Compatible" content="IE=edge">

• 如果您使用的是 IE8，则需要添加 html5.js 脚本，如下所示：

  <!--[if lt IE 9]> <script src="http://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.2/html5shiv.min.js"></script> <![endif]-->

• FontAwesome 与 ie7-js 不兼容。

• 除非将字体设置为可安装嵌入模式，否则 Internet Explorer 会生成错误。 更多信息。

WordPress 特定

• WordPress 会自动在行末添加 <br> 标签，这会破坏图标堆栈。请将您的 HTML 放在一行中或添加到您的样式表中：

  .fa-stack br { display: none }

- Oriol

---

也有可能是您的浏览器插件干扰了渲染。这在Firefox上是一个相当常见的问题。如果是这样，请禁用这些插件或尝试安全模式。 Firefox安全模式：https://support.mozilla.org/zh-CN/kb/troubleshoot-firefox-issues-using-safe-mode?redirectlocale=en-US&redirectslug=Safe+Mode - Oriol

Answer 2

当您升级fontawesome版本时，请确保同时替换css文件和字体。如果您将字体文件夹放置在不同的位置，您还需要在css文件中更新路径。

- Ravimallya

---

哈哈，这节省了我很多宝贵的时间，而我本来没有的，谢谢 :) - lol