Vue项目中引入有色图标

• Z时代
• 2024-01-10
• 分类：综合

vue项目" title="vue项目">vue项目中引入有色图标

1 图标下载

2 图标引入

3 图标使用

图标下载

下载地址：https://www.iconfont.cn/

1 选择需要的图标添加入库

2 在购物车中找到添加的图标，添加至项目

3 在我的项目中，选择front class，点击下载到本地

4 下载完成之后，在本地可以看到如下文件

图标引入

1 在vue项目中，assets文件夹下，新建文件夹icon_custom文件夹，保存下载之后的文件

2 在main.js中引入样式

import '@/assets/icon_custom/iconfont.css
import '@/assets/icon_custom/iconfont.js

图标使用

1 render方式

2 标签Icon形式

3 svg形式，引入有色图标

如果此篇博文对你有用，请给个赞再走。谢谢！！！

以上是 Vue项目中引入有色图标 的全部内容， 来源链接： utcz.com/z/378179.html