IconFont 图标
-
夜景#icon-yejing
-
评论#icon-pinglun
-
附近#icon-fujin
-
会员卡#icon-huiyuanqia
-
眼睛#icon-yanjing
-
首页#icon-shouye
-
首页#icon-shouye1
-
相机#icon-xiangji
-
定位#icon-dingwei
-
社区#icon-shequ
-
首页#icon-shouye2
-
定位#icon-dingwei1
-
会员卡#icon-8
-
通知#icon-tongzhi
-
vip#icon-vip
-
会员卡#icon-huiyuanqia1
-
设置#icon-shezhi
-
首页#icon-shouye3
-
分享#icon-fenxiang
-
朋友圈#icon-pengyouquan
-
添加#icon-add
-
评论#icon-pinglun1
-
版本更新#icon-banbengengxin
-
定位#icon-dingwei2
-
个人资料#icon-ziliao
-
通知#icon-tongzhi1
-
返回#icon-fanhui
-
通知#icon-tongzhi2
-
添加#icon-tianjia
-
分享#icon-fenxiang1
-
首页#icon-shouyehome
-
返回#icon-fanhui1
-
表情#icon-biaoqing
-
眼睛#icon-yanjing1
-
我#icon-wo
-
添加#icon-add1
-
添加#icon-tianjia1
-
朋友圈#icon-pengyouquan1
-
朋友圈#icon-pengyouquan2
-
朋友圈2#icon-pengyouquan21
-
扫描#icon-huitumoban
-
维护#icon-weihu
-
首页#icon-jianyinghome
-
分享#icon-601
-
评论#icon-unie63d
-
功能扩展#icon-unie678
-
评论#icon-pinglun2
-
D-#icon-d
-
好友#icon-haoyou
-
定位#icon-10
-
社区-首页#icon-shouye4
-
社区-社区#icon-shequ1
-
系统升级#icon-xitongshengji
-
功能#icon-gongneng
-
通知#icon-tongzhi3
-
评论#icon-pinglun3
-
我1#icon-wo1
-
踩#icon-cai
-
踩#icon-cai1
-
好友圈#icon-haoyouquan
-
评论#icon-pinglun4
-
社区贴吧#icon-shequtieba
-
调查问卷#icon-diaochawenjuan
-
发现图片#icon-faxiantupian
-
添加#icon-add2
-
返回#icon-fanhui2
-
赞#icon-zan
-
好友#icon-haoyou1
-
设置#icon-shezhi1
-
功能建议#icon-gongnengjianyi
-
sms#icon-sms
-
定位#icon-dingwei3
-
保存#icon-baocun
-
添加#icon-tianjia2
-
分享#icon-fenxiang2
-
朋友圈-01#icon-pengyouquan01
-
朋友圈-01#icon-pengyouquan011
-
朋友圈#icon-pengyouquan3
-
首页#icon-Home
-
个人资料#icon-gerenziliao
-
朋友圈#icon-pengyouquan4
-
定位#icon-dingwei4
-
分享#icon-fenxiang3
-
47通讯录#icon-47tongxunlu
-
设置#icon-shezhi2
-
实心位置签到#icon-shixinweizhiqiandao
-
数据维护#icon-icon103
-
qrcode#icon-qrcode
-
分享#icon-fenxiang4
-
定位#icon-dingwei5
-
好友#icon-haoyou2
-
评论#icon-pinglun5
-
分享#icon-fenxiang5
-
定位#icon-dingwei6
-
单圆微笑#icon-danyuanweixiao
-
踩,鄙视#icon-caibishi
-
定位#icon-dingwei7
-
new#icon-new
-
赞#icon-zan1
-
微信#icon-weixin
-
功能#icon-gongneng1
-
评论#icon-pinglun6
-
添加#icon-tianjia3
-
返回#icon-fanhui3
-
评论#icon-pinglun7
-
会员卡#icon-huiyuanqia2
-
我#icon-wo2
-
分享#icon-share01
-
话费#icon-icon
-
首页#icon-shouye5
-
活动#icon-huodong
-
收藏#icon-shoucang
-
我的#icon-wode
-
零食#icon-lingshi
-
购物#icon-gouwu
-
定位#icon-iconfont80
-
通知#icon-iconfont73
-
设置#icon-iconfontcolor27
-
功能#icon-gongneng2
-
零食饮料#icon-iconfontlsyl
-
分享#icon-fenxiang6
-
分类or广场or其他#icon-fenleiorguangchangorqita
-
好友邀请#icon-haoyouyaoqing
-
添加#icon-tianjia4
-
首页_首页#icon-shouyeshouye
-
商城#icon-shangcheng
-
分享#icon-fenxiang7
-
添加#icon-tianjia5
-
我的问卷#icon-wodewenjuan
-
特价#icon-tejia
-
首页#icon-shouye6
-
朋友圈2#icon-pengyouquan22
-
已是好友#icon-yishihaoyou
-
共同好友#icon-gongtonghaoyou
-
好友请求#icon-haoyouqingqiu
-
通知#icon-tongzhi4
-
空间#icon-kongjian
-
设置#icon-4
-
好友#icon-haoyou3
-
返回#icon-fanhui4
-
定位#icon-dingwei8
-
赞#icon-zan2
-
通知#icon-tongzhi5
-
会员卡#icon-huiyuanqia3
-
首页#icon-shouye7
-
餐厅#icon-canting
-
我创建的#icon-wochuangjiande
-
我关注的#icon-woguanzhude
-
收藏#icon-shoucang1
-
赞#icon-zan3
-
NEW#icon-new1
-
个人资料#icon-gerenziliao1
-
QQ#icon-qq
-
通讯录#icon-tongxunlu
-
首页#icon-shouye11
-
广场#icon-guangchang
-
我#icon-wo3
-
会员卡#icon-huiyuanqia4
-
朋友圈#icon-zhangshangcaifuyemianshoujiban344
-
社区#icon-shequ2
-
新浪#icon-xinlang
-
首页#icon-shouye8
-
添加#icon-tianjia6
-
添加#icon-tianjia7
-
qq#icon-qq1
-
分享#icon-fenxiang8
-
个人资料#icon-gerenziliao2
-
编辑问卷#icon-bianjiwenjuan
-
小花儿-微笑#icon-jinlingyingcaitubiao14
-
扫一扫#icon-icon50
-
aj_新浪#icon-xinlang1
-
问卷#icon-wenjuan
-
我#icon-wo4
-
分享#icon-fenxiang9
-
3.1会员卡#icon-31huiyuanqia
-
样板社区#icon-yangbanshequ
-
朋友圈#icon-pengyouquan5
-
购物#icon-1
-
好友#icon-haoyou4
-
定位#icon-dingwei9
-
设置#icon-shezhi3
-
相机#icon-camera
-
我(未激活)#icon-iconfonticontouzieps03
-
设置#icon-shezhi4
-
特价#icon-tejia1
-
个人资料#icon-gerenziliao3
-
版本更新#icon-banbengengxin1
-
个人资料#icon-gerenziliao4
-
个人资料#icon-gerenziliao5
-
问卷#icon-wenjuan1
-
问卷#icon-wenjuan2
-
版本更新#icon-banbengengxin2
-
新浪#icon-xinlang01
-
评论#icon-pinglun8
-
定位#icon-dingwei10
-
我的#icon-wode1
-
扫码#icon-saoma
-
个人资料#icon-gerenziliao6
-
通用#icon-tongyong
-
评论#icon-pinglun9
-
评论#icon-pinglun10
-
chevron-left#icon-chevronleft
-
评论#icon-pinglun11
-
意见反馈#icon-yijianfankui
-
tag_特价#icon-tagtejia
-
餐饮#icon-canyin
-
签到#icon-qiandao
-
余额#icon-yue
-
评论#icon-pinglun12
-
通知#icon-tongzhi6
-
店家#icon-dianjia
-
我的#icon-wode2
-
返回#icon-fanhui5
-
微信#icon-weixin1
-
社区灰#icon-shequhui2
-
chevron-right#icon-chevronright
-
商城#icon-shangcheng1
-
眼睛#icon-yanjing2
-
朋友圈#icon-1pengyouquan
-
点餐#icon-diancan
-
表情-难过#icon-biaoqingnanguo
-
朋友圈#icon-pengyouquan6
-
评论#icon-pinglun13
-
店铺#icon-dianpu
-
首页#icon-shouye9
-
QQ#icon-qq2
-
定位#icon-location
-
通知#icon-tongzhi7
-
个人资料#icon-gerenziliao7
-
@我#icon-wo5
-
社区#icon-iconfuben
-
PC-功能导航#icon-pcgongnengdaohang
-
briefcase#icon-briefcase
-
bubble#icon-bubble
-
bullhorn#icon-bullhorn
-
camera#icon-camera1
-
camera-video#icon-cameravideo
-
checkmark-circle#icon-checkmarkcircle
-
chevron-down-circle#icon-chevrondowncircle
-
chevron-left-circle#icon-chevronleftcircle
-
chevron-right-circle#icon-chevronrightcircle
-
chevron-up-circle#icon-chevronupcircle
-
circle-minus#icon-circleminus
-
cross-circle#icon-crosscircle
-
sad#icon-sad
-
screen#icon-screen
-
shirt#icon-shirt
-
smartphone#icon-smartphone
-
smile#icon-smile
-
star#icon-star
-
sun#icon-sun
-
sync#icon-sync
-
text-align-center#icon-textaligncenter
-
text-align-justify#icon-textalignjustify
-
text-align-left#icon-textalignleft
-
text-align-right#icon-textalignright
-
thumbs-down#icon-thumbsdown
-
thumbs-up#icon-thumbsup
-
undo#icon-undo
-
user#icon-user
-
功能介绍#icon-gongnengjieshao
-
餐饮#icon-canyin1
-
好友#icon-haoyou5
-
发现#icon-faxian
-
微信#icon-weixin2
-
首页#icon-shouye10
-
通讯录#icon-txl
-
评论#icon-pinglun14
-
社区贴吧-01#icon-shequtieba01
-
定位#icon-dingwei11
-
好友#icon-haoyou6
-
零食#icon-lingshib
-
路径定位#icon-locationdot
-
发现#icon-find
-
返回#icon-18fanhui
-
定位#icon-dingwei12
-
版本更新#icon-banbengengxin3
-
发现#icon-faxian1
-
推荐#icon-tuijian
-
发现#icon-faxian2
-
朋友圈#icon-pengyouquan7
-
朋友圈#icon-pengyouquan8
-
通讯录#icon-tongxunlu1
-
要请好友#icon-yaoqinghaoyou
-
朋友圈#icon-pengyouquan9
-
返回#icon-fanhui6
-
我#icon-wo6
-
WIFI 我fi#icon-wifiwofi
-
积分#icon-jifen
-
广场_square161#icon-guangchangsquare161
-
分享#icon-fenxiang10
-
社区#icon-shequ3
-
首页-默认#icon-icon1
-
定位#icon-track
-
关于#icon-about
-
micb-queding#icon-micbqueding
-
micb-queding_m#icon-micbquedingm
-
零食#icon-home1
-
icon-通讯录#icon-icontongxunlu
-
锁#icon-font50
-
账号安全#icon-user-safe
-
附近#icon-fujin1
-
分享#icon-fenxiang11
-
我#icon-wo7
-
定位开始#icon-dingweikaishi
-
添加#icon-tianjia8
-
我的会员卡#icon-wodehuiyuanqia
-
添加#icon-tianjia9
-
添加#icon-tianjia10
-
我的#icon-wode3
-
添加#icon-tianjia11
-
好友#icon-friend
-
签到#icon-qiandao1
-
个人资料#icon-gerenziliao8
-
扫一扫二维码#icon-saoyisaoerweima
-
朋友圈#icon-pengyouquan10
-
广场_square159#icon-guangchangsquare159
-
广场#icon-guangchang1
-
难过#icon-nanguo
-
分享#icon-fenxiang12
-
发现#icon-faxian3
-
定位#icon-dingwei13
-
首页#icon-shouye12
-
日志#icon-rizhi
-
社区#icon-shequ4
-
通讯录#icon-tongxunlu2
-
通知#icon-shanxiyidongduankaoqinjiankongzhishikushouye05
-
功能#icon-gongneng3
-
功能2#icon-gongneng21
-
功能_智能节能#icon-gongnengzhinengjieneng
-
我收藏的-空#icon-woshoucangdekong
-
添加#icon-tianjia12
-
朋友圈#icon-pengyouquan11
-
定位#icon-dingwei14
-
返回#icon-fanhui7
-
好友通讯录#icon-haoyoutongxunlu
-
bigbig-定位#icon-dingwei15
-
扫一扫#icon-saoyisao
-
分享#icon-fenxiang13
-
我#icon-wo8
-
dialogue-1#icon-dialogue1
-
圈点#icon-quandian
-
ICON_search#icon-icon06
-
朋友圈2#icon-pengyouquan23
-
D#icon-d1
-
账号安全#icon-zhanghaoanquan
-
icon-足迹签到#icon-iconzujiqiandao
-
12.31通讯录#icon-1231tongxunlu01
-
我#icon-wo9
-
dialogue#icon-dialogue
-
016-camera#icon-016camera
-
发现b#icon-faxianb
-
idcard_1e#icon-idcard1e
-
idcard_2f#icon-idcard2f
-
more_verticle#icon-moreverticle
-
我的签名#icon-wodeqianming
-
特价#icon-tejia2
-
发现a#icon-faxiana
-
特价#icon-tejia3
-
返回#icon-o11
-
清理#icon-iconfont
-
附近#icon-fujin2
-
客服#icon-kefu
-
购物#icon-gouwu-copy
-
贴#icon-tie
-
whb_手机绑定#icon-shoujibangding
-
扫一扫#icon-saoyisao1
-
点餐#icon-diancan1
-
扫一扫#icon-saoyisao2
-
发现#icon-faxian4
-
发现-亮#icon-faxianliang
-
弹性升级#icon-danxingshengji
-
签到图标#icon-qiandaotubiao
-
消息#icon-xiaoxi
-
通讯录#icon-tongxunlu3
-
消息#icon-iconxiaoxi
-
我#icon-wo10
-
附近客户#icon-fujinkehu
-
D#icon-d2
-
发现#icon-faxian5
-
通讯录#icon-icon161607
-
交易#icon-jiaoyi
-
我的-账号安全#icon-wodezhanghaoanquan
-
维护#icon-06
-
点子圈#icon-dianziquan
-
积分#icon-jifen1
-
创意社区#icon-chuangyishequ
-
食品#icon-shipin
-
店中店#icon-dianzhongdian
-
水圈#icon-shuiquan
-
交易中#icon-jiaoyizhong
-
余额#icon-yue1
-
特惠价#icon-tehuijia
-
打折#icon-dazhe
-
折#icon-zhe
-
圈子1#icon-quanzi1
-
清理#icon-qingli
-
特价#icon-tejia4
-
手机绑定#icon-shoujibangding01
-
签字#icon-qianming
symbol引用
这是一种全新的使用方式,应该说这才是未来的主流,也是平台目前推荐的用法。相关介绍可以参考这篇文章 这种用法其实是做了一个svg的集合,与另外两种相比具有如下特点:
- 支持多色图标了,不再受单色限制。
- 通过一些技巧,支持像字体那样,通过
font-size
,color
来调整样式。 - 兼容性较差,支持 ie9+,及现代浏览器。
- 浏览器渲染svg的性能一般,还不如png。
使用步骤如下:
第一步:引入项目下面生成的symbol代码:
<script src="./iconfont.js"></script>
第二步:加入通用css代码(引入一次就行):
<style type="text/css">
.icon {
width: 1em; height: 1em;
vertical-align: -0.15em;
fill: currentColor;
overflow: hidden;
}
</style>
第三步:挑选相应图标并获取类名,应用于页面:
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-xxx"></use>
</svg>