Vue項目中使用字體圖標 帶詳細圖解


1、首先在iconfont添加圖標    https://www.iconfont.cn/

2、把要添加的圖標添加至購物車

 

 3、點擊右上角的購物車,點擊添加至項目。沒有項目的話就點擊旁邊的 + 加號建立項目

 

 4、點擊下載至本地

 

 5、下載完畢后,解壓,在你的項目下的assets文件夾里建立一個fonts文件夾,放入解壓之后的字體圖標文件。

  主要放這幾個文件:

  

 

 5、進入inconfont.css文件,修改以下路徑:具體根據你放置的文件位置確定

 

 6、在main.js文件中引入iconfont.css: 

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

 

 接下來就可以使用了。

 

 具體使用方法在你解壓的字體文件里有詳細介紹 : 打開下圖標出的文件

  

效果圖:

 

 

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM