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. Linux下的python安装

    centos7安装python3 以及tab补全功能   1.安装python3 1.1下载python源码包 网址:https://www.python.org/downloads/release/ ...

  2. hdu4325 线段树 成段更新

    #include<stdio.h> #include<string.h> #include<algorithm> using namespace std; #def ...

  3. poj 3225 【线段树】

    poj 3225 这题是用线段树解决区间问题,看了两天多,算是理解一点了. Description LogLoader, Inc. is a company specialized in provid ...

  4. python 嵌套列表

  5. jQuery学习笔记之解除重复点击事情重复绑定

    问题:有不同的按钮点击后都执行相同的事件,在jQuery重复点击就会产生事件重复绑定. 解决方法:使用unbind("click")方法,每次点击都先接触绑定已有事件再绑定新对象. ...

  6. 05Redis入门指南笔记(持久化)

    Redis的强劲性能很大程度上是由于将所有数据都存储在了内存中,然而当Redis重启后,所有存储在内存中的数据就会丢失.在一些情况下,希望Redis能将数据从内存中以某种形式同步到硬盘中,使得重启后可 ...

  7. @总结 - 10@ Miller-Rabin素性测试与Pollard-Rho因数分解

    目录 @1 - 素性测试:Miller-Rabin算法@ @1.1 - 算法来源@ @1.2 - 算法描述@ @1.3 - 算法实现@ @2 - 因数分解:Pollard-Rho算法@ @2.0 - ...

  8. Oracle/PLSQL存储过程详解

    原文链接:https://blog.csdn.net/zezezuiaiya/article/details/79557621 Oracle/PLSQL存储过程详解 2018-03-14 17:31: ...

  9. 运行项目npm run dev时报错: ~Error: Cannot find module 'webpack-cli/bin/config-yargs', 原因是

    webpack@3.X运行项目npm run dev时报错: ~Error: Cannot find module 'webpack-cli/bin/config-yargs' 我的原因是:  web ...

  10. CSS3 ,fill-available、max-content、min-content、fit-content,自适应

    自适应: 撑满空闲空间与收缩到内容尺寸. CSS3将这两种情况分别定义为'fill-availabel'和'fit-content'. 除此之外 ,还新增了更细粒度的'min-content'和'ma ...