IconFont 图标
-
下三角#icon-xiasanjiao
-
锁#icon-suo
-
方向盘#icon-fangxiangpan
-
车灯#icon-chedeng
-
车门#icon-chemen
-
服务#icon-fuwuicon
-
内饰清洗#icon-iconfontneishi
-
右#icon-you
-
定位#icon-dingwei1
-
更换减震器#icon-icon
-
账户#icon-zhanghu
-
我#icon-wo
-
增加相片#icon-zengjiaxiangpian
-
我的#icon-wode
-
订单#icon-order
-
帮助#icon-bangzhu
-
店铺#icon-dianpu
-
我的#icon-wode1
-
购物车#icon-gouwuche1
-
全部#icon-quanbu
-
镀膜镀晶#icon-dumodujing
-
封釉#icon-fengyou
-
编辑#icon-bianji
-
筛选#icon-shaixuan
-
损坏的零件#icon-weibiaoti1fuzhi02
-
浏览#icon-liulan
-
购物车#icon-gouwuche
-
叉#icon-iconcha
-
待收货#icon-daishouhuo
-
客服#icon-kefu
-
TETE_空调清洗#icon-tetekongdiaoqingxi
-
TETE_内饰精洗#icon-teteneishijingxi
-
我的合作#icon-wodehezuo
-
变速箱gearbox#icon-biansuxianggearbox
-
购物车#icon-gouwuche2
-
首页#icon-shouye
-
选择#icon-xuanze
-
身份证#icon-cardid
-
吊车-01-01#icon-diaoche0101
-
启动#icon-qidong
-
首页#icon-shouye1
-
定位#icon-dingwei
-
分享#icon-fenxiang
-
保养#icon-baoyang
-
设置#icon-iconfonticondingbudaohangshezhizhengchang
-
节气门清洗#icon-jieqimenqingxi
-
二手车#icon-ershouche
-
客服#icon-kefu1
-
美容#icon-meirong
-
预选机动车车牌号码#icon-yuxuanjidongchechepaihaoma
-
推荐#icon-tuijianicon
-
电话#icon-dianhua
-
工字钢#icon-icon4
-
救援#icon-jiuyuan
-
音响#icon-yinxiang
-
挂毯_tapestry#icon-guatantapestry
-
选择#icon-dui
-
汽油图标#icon-qiyoutubiao
-
订单#icon-dingdan
-
提醒#icon-tixing1
-
驾驶证换证#icon-jiashizhenghuanzheng
-
iconfont-huoche#icon-iconfonthuoche
-
用户#icon-icon2
-
扫一扫#icon-saoyisao
-
消息#icon-xiaoxi
-
车辆维修#icon-cheliangweixiu
-
待评价#icon-daipingjia
-
地址#icon-dizhi
-
左#icon-zuo
-
账户#icon-lg-zh
-
消息#icon-xiaoxi1
-
代办#icon-daiban
-
打蜡#icon-dala
-
轮胎#icon-item-tyre
-
待评价-[转换]#icon-daipingjiazhuanhuan
-
仪表盘#icon-yibiaopan
-
维修#icon-weixiu
-
钱包#icon-qianbao
-
发电机#icon-fadianji
-
保险#icon-baoxian
-
买车险#icon-artboard6
-
财务管理#icon-caiwuguanli
-
基本信息#icon-jibenxinxi
-
车生活--线性#icon-cheshenghuoxianxing
-
发动机内部清洗#icon-fadongjineibuqingxi
-
更换空调制冷剂#icon-genghuankongdiaozhilengji
-
紧急拖车服务#icon-jinjituochefuwu
-
软件#icon-ruanjian
-
过户#icon-icon1
-
手机#icon-shouji1
-
内饰#icon-neishi
-
收藏#icon-123fuzhi
-
叉叉#icon-chacha-copy
-
全部#icon-quanbu1
-
商品#icon-shangpin
-
制动#icon-zhidong
-
发动机#icon-fadongji
-
漆面#icon-qimian
-
泵#icon-shujutubiao07
-
反馈#icon-fankui
-
验证码#icon-mima
-
上门洗车#icon-shangmenxiche
-
轴承#icon-shujuguanlisvg74
-
双轴#icon-20168314
-
选择#icon-xuanze1
-
历史记录#icon-lishijilu
-
电话#icon-dianhua1
-
后刹车片#icon-houshachepian
-
玻璃#icon-1
-
降序#icon-jiangxu-copy
-
身份证号#icon-shenfenzhenghao
-
车#icon-che
-
轮胎#icon-luntai
-
年审查询#icon-nianshenchaxun
-
驾驶证年审#icon-jiashizhengnianshen
-
补办登记证#icon-bubandengjizheng1
-
补办行驶证#icon-bubanxingshizheng
-
驾驶证补办#icon-jiashizhengbuban
-
贴膜#icon-tiemo
-
类目-粗-全部#icon-leimucuquanbu
-
星级-full#icon-xingjifull
-
星级-line#icon-xingjiline
-
星级-半#icon-xingjiban
-
DVD#icon-icon65
-
补胎#icon-butai
-
退货售后#icon-tuihuoshouhou
-
电瓶搭电救援#icon-dianpingdadianjiuyuan
-
二手车#icon-12
-
服务#icon-fuwu
-
打叉#icon-dacha
-
刹车油#icon-chacheyou
-
44汽车服务#icon-qichefuwu
-
维修#icon-weixiu1
-
钥匙#icon-yuechi
-
维修new#icon-weixiunew
-
仪表盘#icon-yibiaopan1
-
闪电#icon-shandian
-
下三角#icon-xiasanjiao-copy
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>