H5-34 字体图标

　　我们会经常用到一些图标。但是我们在使用这些图标时，往往会遇到失真的情况，而且图片数量很多的话，页面加载就越慢。所以我们可以使用字体图标的方式来显示图标，及解决了失真问题，也解决了图片占用资源的问题

　　常用字体图标库：阿里字体图标库（http://iconfont.cn/）

1、优点：

　　①轻量性：加载速度块，减少http请求

　　②灵活性：可以利用CSS设置大小颜色等

　　③兼容性：网页字体支持所有现代浏览器，包括IE低版本

2、使用字体图标：

　　①注册账号并登录

　　②选取图标或搜索图标

　　③添加购物车

　　④下载代码

　　⑤选择font-class引用

 

 <span class="iconfont icon-dizhi dizhi"></span>

 

 <link rel="stylesheet" href="./download/font_n971gkck0n7/iconfont.css">

 

 .dizhi {

            font-size: 40px;

            color: aquamarine;

        }

设置大小颜色