vue element-ui 引入Iconfont阿里巴巴圖標庫

1.引入鏈接方式引入圖標

1.在阿里巴巴矢量圖新建項目
圖片.png
圖片.png
2.找自己喜歡的項目，加入購物車，再加入項目
圖片.png
3.點擊Font class 下面的生成代碼，復制代碼
圖片.png
4.新建iconfont.css文件。el-icon-cus與上文新建項目FontClass保持一致
[class^="el-icon-cus"], [class*="el-icon-cus"]
{
  font-family:"iconfont" !important;
  font-size:16px;
  font-style:normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
5.在main.js里面引入
import iconfont from './assets/iconfont.css';
6.使用，跟element 里面i使用一樣。可單獨使用，也可引用到組件中。

2.下載引入

1.下載資源


圖片.png

解壓后去掉demo,

圖片.png

在assets目錄下新建iconfont文件夾，拷貝解壓的文件到該目錄下
并在main.js中引入圖標文件

import iconfont from './assets/iconfont/iconfont.css';

更新圖標

引入鏈接的，重新生成鏈接，更新鏈接。
本地下載導入的，重新下載導入

?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
【社區(qū)內容提示】社區(qū)部分內容疑似由AI輔助生成，瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明：文章內容（如有圖片或視頻亦包括在內）由作者上傳并發(fā)布，文章內容僅代表作者本人觀點，簡書系信息發(fā)布平臺，僅提供信息存儲服務。

相關閱讀更多精彩內容

友情鏈接更多精彩內容