字体真棒图标显示为铬广场?

sta*_*ith 11 twitter-bootstrap font-awesome

我试图在按钮内使用font-awsome图标.该图标在Firefox中运行良好但是当我在chrome中使用它时它看起来像一个正方形.我环顾四周,我发现的唯一的事情是,字体的路径可能不正确,但我已经尝试了这里的cdn版本,它仍然在Firefox中工作但不在chrome中.

此外,我在我的计算机上的静态html文件中尝试了相同的样式表,它工作正常.

以下是使用的html示例:

<a id="btnLogin" href="url.com" class="btn btn-primary btn-large disabled">
    <i class="icon-refresh icon-white"></i> 
    Sign in using Facebook
</a>
Run Code Online (Sandbox Code Playgroud)

此外,Web应用程序使用rails构建,并使用bootstrap作为模板.

关于可能导致这种情况的任何想法?

Mic*_*hal 15

我遇到过同样的问题.但我很容易解决它.

在Font Awesome中,字体文件必须放在" fonts "目录中,而不是先前版本中的" font "目录.


Arm*_*oot 8

如果你把所有东西放在适当的位置(你甚至检查了css以确保路径是正确的,并且你想知道你是否需要一个js文件),试着看看你的HTML:

 <i class="fa-users"></i>
Run Code Online (Sandbox Code Playgroud)

这将显示问题中提到的数字/字母的方块(而不是图标).

 <i class="fa fa-users"></i>
Run Code Online (Sandbox Code Playgroud)

这将显示您的图标!请记住,在4.2.0版中,您必须添加fa类!

希望能帮助到你!

  • 大!谢谢先生! (2认同)