font-awesome基本用法

　　官方代码传送门

font-awesome在bootstrap中的特殊用法（这个才是重点）

　　要点归纳1（官方）

　　

　　　　官方代码传送门

　　要点归纳2（我的）

<a href="javascript:void(0);"><span>日志</span><i class="fa fa-caret-right fa-fw pull-right"></i></a>

　　　　原始代码效果：可以看到明显的，三角箭头偏上，当然你也可以对该图标进行自己定位，但经本人测试，确实不怎么好处理（可能水平有限）

　　　　下面提供一种github上常见的解决办法

.fa.pull-right { line-height: inherit; }

　　　　加上css代码后的效果：几乎完美解决

　　　　　　

boostrap-非常好用但是容易让人忽略的地方------Font Awesome的更多相关文章

  1. boostrap-非常好用但是容易让人忽略的地方------input-group-btn

    1.正常的使用 <div class="form-group"> <div class="input-group"> <input ...

  2. boostrap-非常好用但是容易让人忽略的地方------clearfix

    代码 显示结果 代码 结果

  3. boostrap-非常好用但是容易让人忽略的地方------row

    row是非常好用但是却非常容易忽略的地方. 想实现内部元素相对父级的padding=0,则在父子中间加个row.如下图 列嵌套也是同样的道理 经验之谈:学会row的用法,在手机版布局的时候会很方便,否 ...

  4. boostrap-非常好用但是容易让人忽略的地方------modal

    使用bootstrap框架好久了,在开发中也用到了或者遇到了很多的问题,所以跟大家分享一下 bootstrap modal 组件的样式 .modal-lg .modal-sm 说明:这个是bootst ...

  5. boostrap-非常好用但是容易让人忽略的地方【7】：list-unstyled list-inline

    无样式列表 list-unstyled:去掉ul的默认样式 内联列表 list-inline:将ul子元素放置于同一行

  6. boostrap-非常好用但是容易让人忽略的地方【6】：role属性

    普通样式,鼠标hover没有任何效果 <span>content</span> 加上role属性的样式,鼠标hover会有cursor:pointer的效果 <span ...

  7. boostrap-非常好用但是容易让人忽略的地方【5】：input-group-btn

    1.正常的使用 <div class="form-group"> <div class="input-group"> <input ...

  8. boostrap-非常好用但是容易让人忽略的地方【4】：Font Awesome

    font-awesome基本用法 官方代码传送门 font-awesome在bootstrap中的特殊用法(这个才是重点) 要点归纳1(官方) 官方代码传送门 要点归纳2(我的) <a href ...

  9. boostrap-非常好用但是容易让人忽略的地方【3】：clearfix

    代码 显示结果 代码 结果

随机推荐

  1. html学习 - 自己主动跳转与自己主动刷新

    自己主动刷新 事实上自己主动刷新和跳转没啥差别,刷新就是跳转到本地址. 有几种办法,首先是直接在html的<head>标签里加入以下的代码. html代码 代码都放在<head> ...

  2. 开源Office Word——DocX

    1.前言 请阅读前请看以下这位大神的文章 http://www.cnblogs.com/asxinyu/archive/2013/02/22/2921861.html 另附两个附件 1.DocX.DL ...

  3. 重新想象 Windows 8 Store Apps (2) - 控件之按钮控件: Button, HyperlinkButton, RepeatButton, ToggleButton, RadioButton, CheckBox, ToggleSwitch

    原文:重新想象 Windows 8 Store Apps (2) - 控件之按钮控件: Button, HyperlinkButton, RepeatButton, ToggleButton, Rad ...

  4. HDU 2063 过山车 二分图题解

    一个男女搭配的关系图,看能够凑成多少对,基本和最原始的一个二分图谜题一样了,就是 一个岛上能够凑成多少对夫妻的问题. 所以是典型的二分图问题. 使用匈牙利算法,写成两个函数,就很清晰了. 本程序还带分 ...

  5. Android：简单的弹幕效果达到

    首先,效果图.分类似至360检测到的骚扰电话页面: 布局非常easy,上面是一个RelativeLayout,以下一个Button. 功能: (1)弹幕生成后自己主动从右側往左側滚动(Translat ...

  6. Zygote过程【3】——SystemServer诞生

    欢迎转载.转载请注明:http://blog.csdn.net/zhgxhuaa 在ZygoteInit的main()方法中做了几件大事.当中一件便是启动Systemserver进程.代码例如以下: ...

  7. Haskell 几乎无疼痛入门指南

    当他重装Linux 机会虚拟机,安装 haskell 录制的过程中有什么.的方式来帮助那些谁在徘徊haskell进入外读者. 基本概念: Haskell : 是一门通用函数式语言.差点儿能够进行不论什 ...

  8. 【Web探索之旅】第三部分第二课：IP地址和域名

    内容简介 1.第三部分第二课:IP地址和域名 2.第三部分第三课预告:协议 第三部分第二课:IP地址和域名 上一课我们说了在Web之中,全球各地有无数台机器,有些充当客户机,有些作为服务器. 那么这些 ...

  9. CF417D--- Cunning Gena(序列+像缩进dp)

    A boy named Gena really wants to get to the "Russian Code Cup" finals, or at least get a t ...

  10. A Novel Multi-label Classification Based on PCA and ML-KNN

     ICIC Express Letters                  ICIC International ⓒ2010 ISSN 1881-803X Volume4, Number5, O ...