天天看點

阿裡巴巴矢量圖示網使用的小方法

純個人使用過程記錄,非技術分享!

在項目開發中,為界面新增更加豐滿的元素,往往我們會采用一些圖示、圖檔元素來支撐。阿裡巴巴矢量圖示網給産品、給設計、給開發人員給予了極大的幫助與便利。在這裡就沒有找不到的圖示!

那這裡僅僅分享下如何使用此網站将svg格式轉化成字型檔案:

1、登陸網站

2、點選菜單圖示管理——項目管理目錄下

3、将UI提供的svg上傳至項目中

阿裡巴巴矢量圖示網使用的小方法

4、

阿裡巴巴矢量圖示網使用的小方法

5、上傳完畢,點選送出到指定的項目中即可;

6、添加完成之後可以編輯圖示基本資訊(尤其是類名);

阿裡巴巴矢量圖示網使用的小方法

7、之後點選下載下傳至本地即可,會下載下傳一個壓縮包

8、接下來就是代碼上的檔案使用了,

阿裡巴巴矢量圖示網使用的小方法

9、demo_index.html 檔案中有詳細的使用介紹;

阿裡巴巴矢量圖示網使用的小方法

10、樣式類在iconfont.css 中找到類名添加即可;

阿裡巴巴矢量圖示網使用的小方法

繼續閱讀