iconfont 图标库的使用整理（一）

阿里巴巴图标库

iconfont三种用法：前提都是先要引用iconfont图标库

1.Unicode  (font + html)----》iconfont.svg

<span class="iconfont-">&#59173</span>

这里的&#59173编码是iconfont.svg文件里对应图标的编码。

2.Font class （font + css）----》iconfont.css

<span class="iconfont icon-2018-pc"></span>

这里的 icon-2018-pc class名称是iconfont.css文件里对应图标的名称。

3.Symbol  （symbol）----》iconfont.css 

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

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

    </svg>

温馨提示：如果这边的图标现实出来的结果不是你想要的样式，可以自己在样式表里给对应的class名称添加哦

这里的 icon-2018-pc class名称是iconfont.css文件里对应图标的名称。

(切记：不要忘记加“#”，否则就不会出现你想要的图标了哦！)

彩色图标使用Symbol 方式引用。灰色图标前两种方式皆可。同时Symbol 也是可以兼容灰色图标的，但是前两种方式是不支持彩色图标的。

有用的可以收藏哦！