css - 某些 Font Awesome 图标在 Firefox 中不显示，如何调试？

Question

编辑:已解决，请参阅下面的答案。

我正在使用几个 JavaScript 库(其中一些带有 CSS 和网络字体)以及 Font Awesome。 FA 通过 Bower 在本地安装，因此不会尝试进行跨站点请求。

在 Chrome 和 IE 中一切正常，但在 Firefox 上有一些图标(fa-user-secret 和 fa-archive)显示不正确。它们显示为其他一些字符(可能是亚洲人，不知道是哪种语言)。大多数其他图标(例如 fa-user)都可以正常工作。

我的理论是 FA 与来自其他库之一的某些 CSS 和/或网络字体之间存在冲突。可能会加载具有受影响图标的旧 FA，而不是新 FA 版本。我是使用带有自己的 FA 的 dbootstrap(Dojo 的 Bootstrap 主题)——前缀为“icon-”而不是“fa-”。停用 dbootstrap 不能解决问题。

无效的示例代码段:

    <i class="fa fa-archive"></i>

一个有效的例子:

    <i class="fa fa-user"></i>

问题确实只出现在 Firefox 上。

我曾尝试停用其他一些库和 CSS，但卡在了这个过程中。

调试此类问题的推荐方法是什么？

Answer 1

检查 about:config 页面上的 gfx.downloadable_fonts.enabled pref 设置为 true(如有必要，双击该行以切换其值)。

确保您允许页面选择自己的字体。

工具 > 选项 > 内容:字体和颜色 > 高级:[X]“允许页面选择自己的字体，而不是我上面的选择”