IconFont 图标

全选

.quanxuan
二维码

.erweima
搜索

.sousuo
加

.jia
减

.jian
手机

.shouji
热门

.remen
链接

.lianjie
密码

.mima
邮箱

.youxiang
windows

.windows
会员

.huiyuan
大数据

.dashuju
电脑版

.diannaoban
推荐

.tuijian
皇冠

.huangguan
主页

.home
认证

.renzheng
手机版

.mobile
左

.zuo
签到

.qiandao
订单

.dingdan
点击

.dianji
栏目

.lanmu
开心

.kaixin
咖啡

.kafei
条码

.iconset0254
地区

.diqu
资格证书

.zigezhengshu
奖励

.jiangli
退出

.tuichu
红包

.hongbao
图片

.tupian
暂停

.pause
钻石

.zuanshi
基础设置

.jichushezhi
发现

.faxian
刷新

.shuaxin
佣金

.yongjin
分享

.fenxiang
打印

.dayin
vip

.vip
修改

.xiugai
消息

.xiaoxi
身份认证

.shenfenrenzheng
定位

.dingwei
电话 (1)

.dianhua
共享

.gongxiang
区域

.quyu
待收货

.daishouhuo
商品

.shangpin
商户

.shanghu
网站

.wangzhan
推荐人

.tuijianren
中文

.zhongwen
银行卡

.yinxingqia
验证码

.yanzhenma
赠送

.zengsong
定时

.dingshi
安卓

.anzhuo
结算

.jiesuan
提现

.tixian
未打款

.weidakuan
已打款

.yidakuan
银行

.yinxing
下

.xia
扫描

.saomiao
聊天

.liaotian
购物

.gouwu
类别

.menu
余额

.yue
中国银行

.zhongguoyinhang
更新

.gengxin
客服

.kefu
上

.shang
云

.yun
大小

.daxiao
诊断

.zhenduan
难过

.nanguo
失败

.shibai
商家

.shangjia
加载

.jiazai
评价

.pingjia
传真

.chuanzhen
统计

.tongji
支付

.zhifu
统计

.tongji1
金币

.jinbi
会员卡

.huiyuanqia
信号

.wifi
微博

.weibo1
编辑

.bianji
订阅

.dingyue
表格

.biaoge
成功

.chenggong
取消

.quxiao
建设银行

.jiansheyinhang
浦发银行

.pufayinhang
报警

.icon-life-alarm
上传

.shangchuan
交通银行

.jiaotongyinhang
资料

.ziliao
清除

.qingchu
APP

.APP
光大银行

.guangdayinhang
仓库

.cangku
错误

.cuowu
查询

.chaxun
审核

.shenhe
作者

.zuozhe
平安银行

.pinganyinhang
文件

.wenjian
退回

.tuihui
帮助

.bangzhu
华夏银行

.huaxiayinhang
右

.you
错误

.error
列表

.list
ppt

.ppt
QQ

.qq
云硬盘

.yunyingpan
农业银行

.nongyeyinhang
乘号

.chenghao
证书

.zhengshu
分析

.fenxi
最高速度

.sudu
复制

.fuzhi
开始

.kaishi
备案

.icp
指纹

.zhiwen
减少

.jianshao
注册

.zhuce
活动

.huodong
批量

.piliang
禁止

.jinzhi
查看

.chakan
剪切

.jianqie
代理商

.dailishang
工商银行

.gongshangyinhang
充值

.chongzhi
兴业银行

.xingyeyinhang
合同

.hetong
优惠券

.youhuiquan
设置

.shezhi
确定

.queding
打开

.dakai
ios

.ios
折扣

.zhekou
广发银行

.guangfayinhang
中信银行

.zhongxinyinhang
隐藏

.yincang
积分

.jifen
价格

.jiage
收银

.shouyin
日历

.time
招商银行

.zhaoshangyinhang
支付宝

.zhifubao
待发货

.daifahuo
限制

.xianzhi
交易

.jiaoyi
提示

.tishi
处理中

.chulizhong
标签

.biaoqian
成员

.chengyuan
返回

.fanhui
通知

.tongzhi
Excel

.Excel
时间

.shijian
下载

.xiazai
微信

.weixin
word

.word
删除

.shanchu
登录

.denglu
结束

.jieshu
收藏

.shoucang
英文

.yingwen
浏览

.liulan
兑换

.duihuan
无数据

.wushuju
版本

.banben
管理员

.admin
除

.chu
异常

.yichang
收入

.shouru
微信支付

.weixinzhifu
公安

.gongan
民生银行

.minshengyinhang
处理中

.chuli
冻结

.dongjie
页面

.yemian
添加

.add
信用卡-我的

.xinyongqia
线上

.xianshang

font-class引用

font-class是unicode使用方式的一种变种，主要是解决unicode书写不直观，语意不明确的问题。

与unicode使用方式相比，具有如下特点：

兼容性良好，支持ie8+，及所有现代浏览器。
相比于unicode语意明确，书写更直观。可以很容易分辨这个icon是什么。
因为使用class来定义图标，所以当要替换图标时，只需要修改class里面的unicode引用。
不过因为本质上还是使用的字体，所以多色图标还是不支持的。

使用步骤如下：

第一步：引入项目下面生成的fontclass代码：

<link rel="stylesheet" type="text/css" href="./iconfont.css">

第二步：挑选相应图标并获取类名，应用于页面：

<i class="iconfont xxx"></i>

"iconfont"是你项目下的font-family。可以通过编辑项目查看，默认是"iconfont"。