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-非常好用但是容易让人忽略的地方【4】:Font Awesome的更多相关文章

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

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

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

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

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

    代码 显示结果 代码 结果

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

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

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

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

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

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

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

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

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

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

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

    代码 显示结果 代码 结果

随机推荐

  1. Oracle安装 卸载 和常见问题

    Oracle的安装   全局数据库名:orcl  口令:orcl 或者以第三方工具SQLplus为例 系统用户:sys 和 system  练习账户:scott (密码:tiger) 登录账户为:sy ...

  2. 2019-11-1-asp-dotnet-core-简单开发P2P中央服务器

    title author date CreateTime categories asp dotnet core 简单开发P2P中央服务器 lindexi 2019-11-01 19:40:33 +08 ...

  3. [linux]vmware中linux虚拟机扩容 标签: vmware虚拟机linux 2016-09-05 08:03 315人阅读 评

    扩容原因 现阶段,虚拟机的标配都是1G内存和20G硬盘,大部分时候是够用的,但是也会出现虚拟机里面东西放多了硬盘不够用的情况,这种情况下,除了清理垃圾,另外就只能给虚拟机扩容了.因为window扩容相 ...

  4. 巨蟒python全栈开发-第11阶段 ansible3_4

    1.ansible  roles 2.nginx+uwsgi扩展 3.celery异步任务 4.celery延时任务 5.周期任务 6.celery与django结合 7.网络基础 8.celery监 ...

  5. Redis源码解析:05跳跃表

    一:基本概念 跳跃表是一种随机化的数据结构,在查找.插入和删除这些字典操作上,其效率可比拟于平衡二叉树(如红黑树),大多数操作只需要O(log n)平均时间,但它的代码以及原理更简单.跳跃表的定义如下 ...

  6. Python类型模块:types

    types模块中定义了Python中所有的类型,包括NoneType,  TypeType,  IntType,  FloatType,  BooleanType,  BufferType,  Bui ...

  7. HZOJ 礼物

    其实是比较简单的一道期望状压dp,考试时一直在想数组表示概率,然而最后出的数总是小于一,于是无奈的把第一个点判掉放弃了其他点. 设f[i]为状态为i时到全部买到的期望次数,$f[i]=∑f[j]*p[ ...

  8. The Top 50 Proprietary Programs that Drive You Crazy — and Their Open Source Alternatives

    The Top 50 Proprietary Programs that Drive You Crazy — and Their Open Source Alternatives 01 / 22 / ...

  9. CondaHTTPError: HTTP 000 CONNECTION FAILED

    [root@localhost ~]# conda install samtools Solving environment: failed CondaHTTPError: HTTP 000 CONN ...

  10. jq操作class类

    https://www.cnblogs.com/sandraryan/ 鼠标移入移除切换样式 方法一: css .menu { color: green; } .active { color: red ...