IconFont 图标
-
返回.icon-fanhui
-
定位.icon-dingwei
-
返回.icon-fanhui1
-
支付方式.icon-zhifufangshi
-
举报.icon-iconfontjinzhi
-
配送方式.icon-peisongfangshi
-
票.icon-piao
-
详址.icon-xiangzhi
-
粘贴.icon-paste
-
粘贴.icon-zhantie
-
常用信息.icon-yonghuxinxi
-
客服.icon-kefu
-
我的.icon-wode
-
无选择.icon-wuxuanze
-
姓名.icon-xingming
-
选择.icon-xuanze
-
询价采购.icon-xunjiacaigou
-
询价单信息.icon-xunjiadanxinxi
-
直供.icon-zhigong
-
钩.icon-gou
-
购物车.icon-gouwuche
-
盒子打开.icon-hezidakai
-
盒子关闭.icon-heziguanbi
-
结算.icon-jiesuan
-
配件详情.icon-peijianxiangqing
-
首页.icon-shouye
-
图片.icon-tupian
-
图片-关闭.icon-tupianguanbi
-
图片-展开.icon-tupianzhankai
-
公司.icon-gongsi
-
电话.icon-dianhua
-
热门车型.icon-remenchexing
-
搜索.icon-sousuo
-
vin拍照.icon-vinpaizhao
-
保险下单.icon-baoxianxiadan
-
地标.icon-dibiao
-
精米公告.icon-jingmigonggao
-
历史车型.icon-lishichexing
-
配件品牌.icon-peijianpinpai
-
删除.icon-shanchu
-
删除1.icon-shanchu1
-
标题前装饰.icon-biaotiqianzhuangshi
-
加号.icon-jiahao
-
添加配件.icon-tianjiapeijian
-
减号.icon-jianhao
-
竖线.icon-shuxian
-
关闭.icon-guanbi
-
车型.icon-chexing
-
向上.icon-xiangshang
-
修改密码.icon-xiugaimima
-
暂存.icon-zancun
-
常用信息.icon-changyongxinxi
-
待报价.icon-daibaojia
-
待发货.icon-daifahuo
-
待付款.icon-daifukuan
-
待收货.icon-daishouhuo
-
全部订单.icon-quanbudingdan
-
退换货.icon-tuihuanhuo
-
未报价.icon-weibaojia
-
已报价.icon-yibaojia
-
人物.icon-renwu
-
日历.icon-rili
-
修改.icon-xiugai
-
默认.icon-moren
-
勾.icon-gou1
-
加.icon-jia
-
添加联系人.icon-tianjialianxiren
-
无选择-购买详情.icon-wuxuanzegoumaixiangqing
-
选择-购买详情.icon-xuanzegoumaixiangqing
-
我的订单.icon-wodedingdan
-
成功-勾.icon-chenggonggou
-
漏斗.icon-loudou
-
现.icon-xian
-
保险下单1(1).icon-baoxianxiadan11
-
询价完成.icon-xunjiawancheng
-
未报价.icon-weibaojia1
-
已退回.icon-yituihui
-
已过期.icon-yiguoqi
-
所有订单.icon-suoyoudingdan
-
待确认.icon-daiqueren
-
所有订单.icon-suoyoudingdan1
-
已取消.icon-yiquxiao
-
待付款.icon-daifukuan1
-
待发货.icon-daifahuo1
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>
实际情况中"iconfont"(font-family)需要修改为你项目下的font-family。可以通过编辑项目查看,默认是"iconfont"。