提问者:小点点

字体awesome未显示图标


我使用字体很棒,不希望添加CSS与HTTP。我下载了Font Awesome并将其包含在我的代码中,但Font Awesome显示的是一个有边框的方框,而不是图标。下面是我的代码:

<html>
<head>
<link rel="stylesheet" href="../css/font-awesome.css">
    <link rel="stylesheet" href="../css/font-awesome.min.css">
</head>
<body>
<div style="font-size: 44px;">
   <i class="fa fa-camera-retro fa-lg"></i> fa-lg
<i class="fa fa-camera-retro fa-2x"></i> fa-2x
</div>
</body>
</html>

我想知道如何使图标显示而不是边框方框。


共2个答案

匿名用户

在我的例子中,我在css代码中犯了以下错误。

*{
    font-family: 'Open Sans', sans-serif !important;
}

这将覆盖整个页面的所有字体系列规则。我的解决方案是像这样将代码移动到正文中。

body{
    font-family: 'Open Sans', sans-serif;
}

注意:每当在css中使用!importity标志时,在同一元素上声明的任何其他相同类型的css规则都将被覆盖。

匿名用户

打开font-awesome.min.css时,可以看到以下路径:

'Fonts/fontawesome-webfont.ttf?v=4.2.0' ...

这意味着您必须创建目录fonts,然后将文件fontawesom-webfont.ttf(fontawesom-webfont.wofffontawesom-webfont.eot)复制到此文件夹。在那之后,一切都应该运转良好。