2014-02-11 67 views
0

我想用字体真棒4.0.3与-circle-o tags和我的图标每次都消失。字体真棒4.0.3 - 圆不工作

我使用它,像这样:<i class="fa fa-twitter-circle-o fa-2x"></i>

我没有得到一个空白的方形或任何其他的各种各样的;只是一个空白。

这工作:<i class="fa fa-twitter fa-2x"></i>

不应该根据自己的new naming conventions的第一项工作?

*编辑*

要详细一点,我知道,就像你在3倍可能,我可以堆叠起来,所以暂时,我有以下的(因为圈子这么厚):

<span class="fa-stack fa-lg"> 
    <i class="fa fa-square-o fa-stack-2x"></i> 
    <i class="fa fa-twitter fa-stack-1x"></i> 
</span> 

也许我误解的FA现场的文档,但我把它读作其他应该工作。

回答

1

我想你可能需要堆叠起来:

<span class="fa-stack fa-lg"> 
    <i class="fa fa-circle-o fa-stack-2x"></i> 
    <i class="fa fa-twitter fa-stack-1x"></i> 
</span> 

见叠放图标:http://fortawesome.github.io/Font-Awesome/examples/

+0

这就是我所做的,以保持它寻找有良好的设施。我更多地认为,在我的链接中的文档,说明其他应该工作。我读错了吗?猜猜我应该详细说明OP ... – W3bGuy

+0

我可以看出你为什么会这么想。特别是当他们说“把他们合并......”时。我可能是错的,但是,虽然他们已经实现了一个新的命名约定,但我不认为它允许你通过命名它们来组合不同的图标。看起来他们只是试图在命名上更加一致,所以编码更容易。只是我2美分。 – moodyjive

0

你说的没错认为,基于Font Awesome naming conventions,你正在试图做的应该是什么工作:

讽刺的是,他们对改变命名约定动力是:

一种更好的图标命名一致性预测

然而欲望,他们没有这样做,在文档化做好哪些符号变量是可用的。

通知fa-check-circle作品,但fa-twitter-circle没有。

如果按Ctrl +˚F为他们CSS source “圈子” 对了,你会发现,只有下列符号圆圈版本:

  • 播放*
  • 加*
  • 时报*
  • 检查*
  • 问题
  • 信息
  • 十字线
  • 感叹号
  • 箭*
  • 雪佛龙公司*

**(一些变量包括在内)*

如果你放任何其他东西,它只会成为一个随机的字母组合就CSS而言。它不符合任何预定义的类,因此它不会将其视为任何特殊的类;这就是为什么当你尝试添加圆时你会失去图标。

已经提出的替代方法是使用fa-stack来手动合并一个圆圈和一个小鸟。由于圈似乎有点厚,而不是用-o翻转鸟,你可以反转圆圈.fa-inverse这样的:

<span class="fa-stack fa-lg"> 
    <i class="fa fa-circle fa-stack-2x"></i> 
    <i class="fa fa-twitter fa-stack-1x fa-inverse"></i> 
</span> 

这里有一个Demo of the stacked option and every available circle icon

这里是什么样的演示看起来像一个screnshot:

screenshot