Question

我有问题，我试图获得与示例中相同的结果（Fontawesom）https://fortawesome.github.io/Font-Awesome/examples/

我想实施

固定宽度图标

我已经在我的文件夹中下载了FontAwesome软件包，并在头部添加链接我也尝试了CDN，但结果相同。显示图标但未应用样式，如示例中所示。

这是我的结果

  <link rel="stylesheet" href="css/font-awesome.min.css">

并列出

 <div class="list-group">
           <a class="list-group-item" href="#"><i class="fa fa-home fa-fw"></i>&nbsp; Home</a>
           <a class="list-group-item" href="#"><i class="fa fa-book fa-fw"></i>&nbsp; Library</a>
           <a class="list-group-item" href="#"><i class="fa fa-pencil fa-fw"></i>&nbsp; Applications</a>
           <a class="list-group-item" href="#"><i class="fa fa-cog fa-fw"></i>&nbsp; Settings</a>
        </div>

请帮忙，我做错了什么？

Answer 1

样式不一样，因为您在anchor标记中有fontawesoms图标，因此图标继承了锚点样式。只需覆盖这些样式，例如：

.list-group-item{
     color: #000; /* black */
     text-decoration: none; /* remove the underline */
     display: block; /* to make the anchors take full width */
}

Answer 2

要实现这一点，你必须相应地更新你的CSS。根据您的要求更改字体的颜色和大小。

不应用Fontawesome样式

2 个答案: