在我们经常看到的天猫、京东等网站上，你会发现有这样的小图标：
其实可以通过图像来实现，但是如果使用矢量图标的话，可以减少请求数量哦~
使用http://www.Sina.com/:
1 .搜索蚂蚁矢量图标：
2 .登录
3.
选择要在图标库中使用的图标： (以下以天猫购物车为例) )。
官方图片库-找到并打开
找到了
添加签入
打开
下载并解压缩
新文件夹-放入单杠iconfont文件夹
步骤1 :在项目下引入生成的字体类代码： link rel=' style sheet ' href=' ./icon font.CSS '步骤2 :选择相应的图标获取类名，进入页面
你记住矢量图标的使用方法了吗~
呃！ doctypehtmlhtmllang=' en ' headmetacharset=' utf-8 ' metaname=' viewport ' content=' width=device-width， initial-scale=1.0 ' meta http-equiv=' x-ua-compatible ' content=' ie=edge ' title燕尾图标/title/headlinkrel=} .nav { width: 200px； /* height: 540px； */margin: 80px auto 0； } .navh3 { height: 42px； background-color: red； line-height: 42px； } .navh3 i { margin-left: 20px； 边距-左： 5px； }.navul { list-style-type : none； } .nav ul li { height: 30px； background-color: #696969； line-height: 30px； 文本索引： 15px； }.navul lia { text-decoration : none； color: #fff； 字体大小： 14px； } .nav ul li i { color: #b4b4b4； }/stylebodydivclass=' nav ' H3 iclass=' iconfonticon-liebiao '/ispan商品分类/span/H3 ulli class=' iconfonticon-nvzhusticon '男装/运动户外/a/Lili class=' iconfonticon-Xie '/ia href=' # '女子Lili iclass=' iconfonticon-huazhang pin '/ia href Lili class=' iconfonticon-zhubaoshipin '/iahhubaoshipin '/I Lili iclass=' iconfonticon-shuma shouji '/ia href=' # ' Lili class=' iconfonticon-muyingwanju '/ia Lili iclass=' iconfonticon-jujia '/ia href=' # '零食/茶酒/进口食品/a/Lili CLI ia Lili iclass=' iconfonticon-jiayongdianqi '/ia href=' # '大家电气/生活用电器/a/Lili class=' iconfonticon-jiaju Iahref='# '汽车/配件/用品/a/Lili class=' iconfonticon-jiafangjiashi '/iconfonticon Lili class=' iconfonticon-jiafang '/ia href=' # # Lili iclass=' iconfonticon-tushu yinxiang '/ia href=' # '图书影音/