字体太棒了一些图标缺失

Question

我对这个问题感到很疯狂。我想在页面上显示8个图标，但只显示其中的4个。我查了this for help，但没有任何用处。我也检查了StackOverflow，但也没有得到任何有用的东西。

完整代码为here。

这就是我看到图标的方式：

我在localhost中获取此内容并将其上传到altervista。我通过Chrome，Firefox和Vivaldi获得了这个功能。我用本地fa文件和CDN得到这个。不可见的图标缺少:before，但我不知道为什么。有人能帮助我吗？

Answer 1

您正在使用版本4.7中引入的图标（例如fa-thermometer-half或fa-free-code-camp）。但是在您的网站中，包含了FontAwesome的4.6.3版本（请参阅here）。因此，将FontAwesome实例更新到最新版本以解决您的问题。

Answer 2

在我的情况下，问题是在CSS中我正在做的事情：

.icon:before {
    font-family: "Font Awesome";
}

虽然它应该是：

.icon:before {
    font-family: "Font Awesome 5 Free";
}

使单个字符变得不同会导致某些图标消失。可怕的事。 希望这会有所帮助。

Answer 3

请使用最新版本的Font Awesome或将此代码复制到您的头部。

<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">

Answer 4

您可以使用Bootstrap CDN提供的此CDN替换现有的Font Awesome CSS链接，并查看其中的魔力。

CDN：https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css