HTML：fontawesome图标会出现两次

我试图制作一个带有HTML5和FontAwesome的网页。我的问题是：如果我包括FontAwesome图标出现两次，两个副本都在彼此样的堆积（见有：image）HTML：fontawesome图标会出现两次

我改变了一下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”（它是干什么用的？），玩着“display：”，加上“vertical-alignment”，因为星星在天空中有点...没什么帮助。

有人曾经有类似的东西？这个问题出现在Firefox，Opera和IE上。

最好的问候，安娜

来源

2012-11-25 anna

这将是一个的jsfiddle或其他一些预览很有帮助。提供的CSS，似乎不是问题。 –

请参阅http://stackoverflow.com/questions/12330032/font-awesome-icons-alignment。 –

我只是有这个问题我自己，我想通了，我需要什么来解决。在bootstrap.css除去

.icon-star-empty { background-position: -144px 0; }

基本上CSS中在2个地方，一旦在字体awesome.css bootstrap.css &一次，所以它显示了两次。

来源

2012-12-13 13:47:39

这将只修复空的星形图标。不是一个好的解决方案根据@Martin Harrigan的评论，请参阅[这个问题]（http://stackoverflow.com/questions/12330032/font-awesome-icons-alignment）来更正所有重复的图标。 – LuckySpoon

我可以进一步细化，但基本上这个问题不应该出现在3.0（几周前发布）。

这来自Bootstrap设置类的图标类在他们的sprites.less。这些指示说要评论sprites.less，但很多人错过了。在新版本中，有重写可以解决这个问题。

另外，如果你想使用字体真棒真的容易做，你可以使用引导CDN：http://www.bootstrapcdn.com/?v=01042013155511#tab_fontawesome

来源

2013-01-18 01:42:20

HTML：fontawesome图标会出现两次

回答

相关问题