IconFont 图标
-
notification_fill.icon-notificationfill
-
notification.icon-notification
-
more.icon-more
-
lock.icon-lock
-
mobile_fill.icon-mobilefill
-
creative_fill.icon-creativefill
-
creative.icon-creative
-
rank_fill.icon-rankfill
-
支付宝钱包.icon-rectangle390
-
余额宝.icon-icon
-
转账.icon-zhuanzhang
-
信用卡还款.icon-xinyongqiahuankuan
-
当面付.icon-dangmianfu
-
水电煤.icon-shuidianmei
-
手机充值.icon-shoujichongzhi
-
亲密付.icon-qinmifu
-
股票.icon-gupiao
-
游戏充值.icon-youxichongzhi
-
收款.icon-shoukuan
-
机票.icon-jipiao
-
汇率换算.icon-huilvhuansuan
-
记账本.icon-jizhang
-
旅游特惠.icon-lvyoutehui
-
快递.icon-kuaidi
-
话费卡转让.icon-huafeiqiazhuanrang
-
手机宝令.icon-shoujibaoling
-
钱包朋友.icon-qianbaopengyou
-
快抢.icon-kuaiqiang
-
随身贷.icon-suishendai
-
我的保障.icon-wodebaozhang
-
会员特权.icon-huiyuantequan
-
成功.icon-chenggong
-
失败.icon-shibai
-
警示.icon-jingshi
-
提示.icon-tishi
-
帮助.icon-bangzhu
-
等待.icon-dengdai
-
相机.icon-xiangji
-
手机通讯录.icon-shoujitongxunlu
-
我的.icon-wode
-
搜索.icon-sousuo
-
地图.icon-ditu
-
扫一扫.icon-saoyisao
-
付款码.icon-fukuanma
-
城市服务.icon-chengshifuwu
-
教育缴费.icon-jiaoyujiaofei
-
一般.icon-yiban
-
社交.icon-shejiao
-
通讯.icon-tongxun
-
数码.icon-shuma
-
学习.icon-xuexi
-
礼物.icon-liwu
-
还款.icon-huankuan
-
理财.icon-licai
-
工资.icon-gongzi
-
兼职.icon-jianzhi
-
理财收益.icon-licaishouyi
-
其他收入.icon-qitashouru
-
添加类目.icon-tianjialeimu
-
财富A.icon-caifua
-
财富B.icon-caifub
-
paint_fill.icon-paintfill
-
paint.icon-paint
-
people_fill.icon-peoplefill
-
people.icon-people
-
repair.icon-repair
-
repair_fill.icon-repairfill
-
command_fill.icon-commandfill
-
command.icon-command
-
community_fill.icon-communityfill
-
community.icon-community
-
sponsor_fill.icon-sponsorfill
-
sponsor.icon-sponsor
-
单选-fill.icon-danxuanfill
-
单选.icon-danxuan
-
方形未选中.icon-fangxingweixuanzhong
-
方形选中-fill.icon-fangxingxuanzhongfill
-
方形选中.icon-fangxingxuanzhong
-
关闭1.icon-guanbi1
-
关闭2-fill.icon-guanbi2fill
-
关闭2.icon-guanbi2
-
加号.icon-jiahao
-
加号1.icon-jiahao1
-
加号2-fill.icon-jiahao2fill
-
减号.icon-jianhao
-
提示-fill.icon-tishifill
-
提示.icon-tishi1
-
问号-fill.icon-wenhaofill
-
问号.icon-wenhao
-
选择.icon-xuanze
-
圆形未选中.icon-yuanxingweixuanzhong
-
圆形选中-fill.icon-yuanxingxuanzhongfill
-
圆形选中.icon-yuanxingxuanzhong
-
标星-fill.icon-biaoxingfill
-
标星.icon-biaoxing
-
店铺-fill.icon-dianpufill
-
店铺.icon-dianpu
-
分享.icon-fenxiang
-
更多.icon-gengduo
-
购物车-fill.icon-gouwuchefill
-
购物车.icon-gouwuche
-
留言-fill.icon-liuyanfill
-
留言.icon-liuyan
-
朋友-fill.icon-pengyoufill
-
朋友.icon-pengyou
-
扫码.icon-saoma
-
首页-fill.icon-shouyefill
-
首页.icon-shouye
-
通知-fill.icon-tongzhifill
-
通知.icon-tongzhi
-
我的-fill.icon-wodefill
-
我的.icon-wode1
-
信息-fill.icon-xinxifill
-
信息.icon-xinxi
-
足迹.icon-zuji
-
坐标-fill.icon-zuobiaofill
-
向右1.icon-xiangyou1
-
向左1.icon-xiangzuo1
-
相机1-fill.icon-xiangji1fill
-
相机1.icon-xiangji1
-
相机2.icon-xiangji2
-
加载.icon-jiazai
-
刷新.icon-shuaxin
-
wifi.icon-wifi
-
Android更多.icon-androidgengduo
-
类目.icon-leimu
-
单品.icon-danpin
-
居家.icon-jujia
-
品牌.icon-pinpai
-
特权专属.icon-tequanzhuanshu
-
箱包.icon-xiangbao
-
goods_new_fill.icon-goodsnewfill
-
goods_new.icon-goodsnew
-
news_hot_fill.icon-newshotfill
-
news_hot.icon-newshot
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 icon-xxx"></i>
"iconfont"是你项目下的font-family。可以通过编辑项目查看,默认是"iconfont"。