字体图标

1. 为什么要用字体图标

        1. 图片过大，会增加服务器的压力

        2. 通过样式设置图片会失真

2. 定义：是一种字体inconfont可以设置大小颜色

3. 下载过程

        1. 打开http://www.iconfont.cn/登录

        2. 搜索想要使用的字体图标添加入库

        3. 在库中创建项目

        4. 可以编辑字体图标的大小、形状、颜色

        5. 下载至本地

4. 使用方法

•  Unicode  

            1. 引入iconfont.css

            2. 查找对应的字体编码

            3. 使用： <span class="iconfont">&#xe601;</span>

•    Font class  

            1. 引入iconfont.css

            2. 查找对应的字体类名

            3.  使用<div class="iconfont icon-fangzi"></div>

•     Symbol

            1. 引入iconfont.js

            2. 引入入特定样式

            3. 查找对应的字体类名

<svg class="icon" aria-hidden="true">

          <use xlink:href="#icon-suosou"></use>

     </svg>

5. 优点

        1. 可以做出跟图片一样可以做的事情,改变透明度、旋转度，等..

        2. 但是本质其实是文字，可以很随意的改变颜色、产生阴影、透明效果等等...

        3. 本身体积更小，但携带的信息并没有削减。

        4. 几乎支持所有的浏览器

        5. 移动端设备必备良药...