• 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>
     

  • 相关阅读:
    JavaEE 第四周
    JavaEE 第三周
    JavaEE 第二周
    JavaEE 第一周
    js字符串方法
    javaee项目库存管理系统总结
    javaee期末团队项目库存管理系统概要信息
    JAVAEE第十一周
    JSON
    Facelets
  • 原文地址:https://www.cnblogs.com/supershare/p/7245379.html
Copyright © 2020-2023  润新知