上一篇《ionic（mui、elementUI）自定義字體圖標》寫一部分了。重要的點，再強調一下下。

在阿里媽媽上的項目中編輯相關屬性：

elementUI 的前綴是el-icon,Font Family是element-icons；

然后下載下來的代碼就不需要怎么改了，和ionic圖標有所區別的是：

ionic的圖標有3套，分別對應于iOS和安卓以及windows，所以它的css字體圖標要添加相關適配，

不同的設備，配置不同樣式的圖標，可以說是很6了呀。

而elementUI就一套，所以不麻煩。我的做法比較簡單，直接引用了原有的css如下圖：

因為，vue項目的文件入口時App.vue,所有的css,js文件都需要在main.js中引入，可以直接再main.js文件中引入字體文件

的iconfont.css,我不是這樣做的，我是在assets文件夾下建了一個less文件夾，里面包含了index.less文件和variable.less文件，

然后在index.less文件里引入的iconfont.css,同時main.js中引入了index.less。如下圖：

main.js文件

應用：

效果圖：

嗯，終于整理完了，哈哈，大概沒有什么遺漏吧，不過要注意一下，字體css文件的引入問題！！！

不要搞錯了，有什么不懂的，歡迎私信，啦啦啦啦~~~~

總結

以上是生活随笔為你收集整理的elementUI自定义字体图标的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。