HTML:fontawesome 图标出现两次

Question

我正在尝试使用 HTML5 和 FontAwesome 制作网页。我的问题是:如果我包含一个 FontAwesome 图标，它会出现两次，并且两个副本会相互堆叠(参见此处:image)

我更改了一些 fontawesome.css，但在发现问题后，我再次从下载中复制文件以重置所有更改:问题仍然存在。所以我的 .css 部分说:

[class^="icon-"]:before, [class*=" icon-"]:before {
  font-family: FontAwesome;
  font-weight: normal;
  font-style: normal;
  display: inline-block;
  text-decoration: inherit;
}

然后我将它包含在标题中

<h3><i class="icon-star-empty"></i>&nbsp;Angebote</h3>

不幸的是，我并没有真正看到问题所在。

我尝试删除 .css 中的“:before”(它到底做了什么？)，玩“显示:”，添加“垂直对齐”，因为星星有点在天空中......没有有帮助。

有人遇到过类似的事情吗？该问题出现在 Firefox、Opera 和 IE 上。

最好的问候，安娜

Answer 1

如果您忘记关闭 <i>，您可能会遇到类似的行为正确标记我当时有多个图标

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

代替

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