Font awesome是一种用字体来实现图标的CSS插件。

使用方法：

  1. 到http://fortawesome.github.io/Font-Awesome/ 下载代码包。
  2. 代码包解压到本地后，结构如下

  3. 在网页中引用css/font-awesome.css或者css/font-awesome.min.css

    比如：

    <link rel='stylesheet', href='font-awesome-4.3.0/css/font-awesome.min.css'/>

  4. 在网页中用如下的方式来显示图标。

    <i class="fa fa-camera"></i>

    效果如下:

     

    既然是一种字体，就可以通过改变字体颜色和字体大小等属性来控制图片的显示方法。

<div>

<i class="fa fa-camera" style="color:green;font-size:20px;"></i>camera

</div>

 

效果如下：

还可以旋转，加动态效果，更多例子可以参见：

http://fortawesome.github.io/Font-Awesome/examples/

 

  1. FontAwesome目前包含的所有图标列在这里：

    http://fortawesome.github.io/Font-Awesome/icons/

     

Font Awesome使用简介的更多相关文章

  1. 更丰富的符号工具包 Font Awesome

    我时常想要在此类文档中通过一些图形符号来表达更丰富的含义或是对段落进行标注,例如使用 Emoji.然而 Emoji 在这方面仍然有存在一些不足,如: 颜色与文字风格不统一, 在不同系统的平台上显示不统 ...

  2. 漂亮的title提示信息

    <HTML> <HEAD> <title>一种很酷的文字提示效果演示</title> <style> .tableBorder7{width ...

  3. 将 Eclipse 的配色改为黑底白字

    1.先到 eclipsecolorthemes下载一个主题. 2.Eclipse File-->Import 3.Import视窗内选择 General-->Preferences 4.选 ...

  4. 个人知识管理系统Version1.0开发记录（11）

    (1)匹配单个属性的关键字:(2)匹配单个对象的关键字:(3)匹配对象集合的关键字:(4)基于事件驱动的:(5)实时搜索,参考win7的搜索功能. 1.备份,java代码,数据库数据. 2.oracl ...

  5. cms-幻灯片的实现

    1.其实幻灯片的后台代码和之前的最新动态和推荐是一样的,只是前台遍历的时候不一样罢了 2.代码: 2.1:帖子mapper查询出幻灯片图片: <?xml version="1.0&qu ...

  6. cms-最近更新

    在这一讲中有几个很重要的地方需要注意: 1.在查询帖子的时候需要把帖子类型id带到帖子类型表中把类型查询出来 2.在字帖子查询语句中用limt限制查询那个阶段的帖子 3.在界面显示的时候需要用到字符串 ...

  7. CSS3与页面布局学习总结（五）——Web Font与Sprite

    一.web font web font是应用在web中的一种字体技术,在CSS中使用font-face定义新的字体.先了解操作系统中的字体: a).安装好操作系统后,会默认安装一些字体,这些字体文件描 ...

  8. canvas简介

    一.canvas简介 1.1 什么是canvas?(了解) 是HTML5提供的一种新标签 <canvas></canvas> 英 ['kænvəs] 美 ['kænvəs] 帆 ...

  9. 常用HTML标签元素结合及简介

    常用HTML标签元素结合及简介 <html></html> 创建一个HTML文档<head></head> 设置文档标题和其它在网页中不显示的信息< ...

随机推荐

  1. hdu 1325 判断有向图是否为树

    题意:判断有向图是否为树 链接:点我 这题用并查集判断连通,连通后有且仅有1个入度为0,其余入度为1,就是树了 #include<cstdio> #include<iostream& ...

  2. hdu 4540 dp

    题意: 假设: 1.每一个时刻我们只能打一只地鼠,并且打完以后该时刻出现的所有地鼠都会立刻消失: 2.老鼠出现的位置在一条直线上,如果上一个时刻我们在x1位置打地鼠,下一个时刻我们在x2位置打地鼠,那 ...

  3. 【洛谷】1852：[国家集训队]跳跳棋【LCA】【倍增？】

    P1852 [国家集训队]跳跳棋 题目背景 原<奇怪的字符串>请前往 P2543 题目描述 跳跳棋是在一条数轴上进行的.棋子只能摆在整点上.每个点不能摆超过一个棋子. 我们用跳跳棋来做一个 ...

  4. 使用ViewPager实现android软件使用向导的功能

    现在的大部分android软件,都是使用说明,就是第一次使用该软件时,会出现向导,可以左右滑动,然后就进入应用的主界面了. 先看下效果图: 首先需要一个布局文件,是FlameLayout组成的,里面包 ...

  5. Go语言Web框架gwk介绍 (一)

    今天看到Golang排名到前30名了,看来关注的人越来越多了,接下来几天详细介绍Golang一个web开发框架GWK. 现在博客园支持markdown格式发布文章么?后台的编辑器不太好用嘛. GWK ...

  6. HOWTO: Get the command line of a process(转)

    How would you get the command line of a process? Some people have suggested that you use remote thre ...

  7. vultr vs digitalocean vs linode

    vultr官方网站:www.vultr.comdigitalocean官方网站:www.digitalocean.comlinode官方网站:www.linode.com 一般来说我们买VPS的时候都 ...

  8. sunstudio 12.3 on solaris 10

    #include <stdio.h> #include <stdlib.h> #define RPT 10000000 int main() { int i=1; for( i ...

  9. [MySql]锁表与解锁

    摘要 为啥会出现锁表的情况?锁表会导致数据表的其他操作超时,频繁的插入修改查询很容易出现锁表的情况.如果遇到这种情况,临时的解决办法,可以通过下面的方式进行解锁.如果长期有效的解决,那么就需要优化项目 ...

  10. .Net高级技术——字符串拘留池(Intern)

    一.深入理解字符串的不可变特性 string可以看做是char的只读数组.char c = s[1] C#中字符串有一个重要的特性:不可变性,字符串一旦声明就不再可以改变.所以只能通过索引来读取指定位 ...