Font Awesome 图标使用总结
参考 http://fontawesome.dashgame.com/
1 大图标递进
fa-lg (33%递增)、fa-2x、 fa-3x、fa-4x,或者 fa-5x
2 固定宽度
fa-fw 可以将图标设置为一个固定宽度。主要用于不同宽度图标无法对齐的情况
3 用于列表
使用 fa-ul 和 fa-li 便可以简单的将无序列表的默认符号替换掉。
4 边框与对齐
用 fa-border 以及 pull-right 或 pull-left 可以轻易构造出引用的特殊效果。
<i class="fa fa-quote-left fa-3x pull-left fa-border"></i>
5 动画
fa-spin 类来使任意图标旋转
fa-pulse 来使其进行8方位旋转
尤其适合fa-spinner、fa-refresh 和 fa-cog
6 翻转与旋转
使用 fa-rotate-* 和 fa-flip-* 类可以对图标进行任意旋转和翻转。
fa-rotate-90 fa-rotate-180 fa-rotate-270
fa-flip-horizontal fa-flip-vertical
7 组合使用 想要将多个图标组合起来,
使用 fa-stack 类作为父容器,
fa-stack-1x 作为正常比例的图标,
fa-stack-2x 作为大一些的图标。
fa-inverse 类来切换图标颜色。
您可以在父容器中 通过添加 大图标 类来控制整体大小。
<span class="fa-stack fa-lg">
<i class="fa fa-camera fa-stack-1x"></i>
<i class="fa fa-ban fa-stack-2x text-danger fa-inverse"></i>
</span>