小科普：
想必小伙伴們多少都了解或使用過字體圖標，總體來說優點多於缺點，優點如下圖：
- 任意縮放，圖標不會失真；
- 可以改變圖標顏色；
- 可以設置圖標陰影；
- 可以設置透明效果；
- 主流瀏覽器都支持；
- 可以快速轉化形態（做出一些變化，如 :hover等）；
- 體積更小，並且不會有http請求，從而一定程度上利於前端優化
我個人一般使用 阿里巴巴矢量圖標庫
推薦一篇介紹為什么使用字體圖標和怎樣使用字體圖標的文章：http://www.w3cplus.com/css3/icon-fonts.html
正題：
想必小伙伴們多少了解過SVG。SVG最大的特點——可以任意伸縮的矢量圖形（圖片可任意伸縮，且不會失真）
SVG基礎教程：http://www.runoob.com/svg/svg-tutorial.html
在實際項目中，怎樣才能使用SVG格式的圖片呢？
因為SVG不能像一般的位圖可以直接用img標簽引入，這個時候就需要把SVG轉換為字體圖標
推薦一個網站：http://icomoon.io/ （因為是國外的網站，所以比較慢，請耐心等待）
下面介紹該網站怎樣使用，把SVG轉化成字體圖標
①：打開官網后，點擊下圖紅色箭頭的地方
②：如下圖
1：箭頭指的地方IcoMoon Free就是該網站免費提供的字體圖標
2：箭頭右邊的紅色框是可以選擇字體圖標的大小
3：底部紅色框，從左到右，意思分別是 生成SVG，你選擇的字體圖標個數，生成字體圖標
4：如果你不想使用該網站提供的字體圖標，就點擊下圖紅色圓圈的 import icons 選項
③： 點擊Import icons 選項以后，導入本地SVG格式圖標，然后會看到本地SVG已經被導入到當前頁面，如下圖：
④：最后選中導入的SVG，在點擊Generate Font 選項下載即可
