ElementUI從PNG開始,本身添加ICON

自定義ICON需求廣泛,不過每每只有一些PNG圖片,這個時候就須要:css

  1. 轉化PNG爲SVG
  2. 製做ICON的CSS庫
  3. 添加相關CSS文件,並在項目中引用。

1:轉化PNG爲SVG,推薦一個網站 格式轉化 須要注意的是,下一步製做須要的SVG文件大小限制爲40K,請注意。網站

2:製做ICON,這裏又推薦一個網站,就是 阿里圖庫 基本流程教程

3:這個時候已經有了帶有本身圖標的CSS文件了,最新的文件有6個,以下 文件列表圖片

4:進入本身的Element項目中,拷貝上面這幾個文件到項目中 修改iconfont.css文件: 輸入圖片說明get

5:而後在本身的項目中直接使用本身的clsName就好了 也就是你在阿里圖庫裏看到的: 輸入圖片說明it

不知道這個簡陋的教程能不能幫到有些人,要養成記錄的習慣。主要仍是爲本身!io

相關文章
相關標籤/搜索