uniapp如何使用自定义的图标

http://t.csdnimg.cn/8KenC

以上是原文章,下面内容是从这篇文章转发的

一、导入

1.在官方(iconfont-阿里巴巴矢量图标库)选择自己想要的图标,加入购物车

  1. 在点击购物车下载代码

3.解压文件夹 并更改名字

4.将文件夹(iconfont)整个放到项目中的static中

5.修改iconfont.css文件

6.在App.vue中全局引入 iconfont.css文件

二、使用

在页面中如何使用?

1、在iconfont.json中找到相对应的font-class

2.在页面中使用

注意:

一定要添加类名 :iconfont

每个独立样式前添加前缀 :icon-

原文链接:https://blog.csdn.net/karlaofsky/article/details/136970579

相关推荐
尚梦4 小时前
uni-app 封装刘海状态栏(适用小程序, h5, 头条小程序)
前端·小程序·uni-app
尚学教辅学习资料11 小时前
基于SSM+uniapp的营养食谱系统+LW参考示例
java·uni-app·ssm·菜谱
Bessie23411 小时前
微信小程序eval无法使用的替代方案
微信小程序·小程序·uni-app
qq229511650220 小时前
小程序Android系统 校园二手物品交换平台APP
微信小程序·uni-app
qq22951165021 天前
微信小程序uniapp基于Android的流浪动物管理系统 70c3u
微信小程序·uni-app
qq22951165021 天前
微信小程序 uniapp+vue老年人身体监测系统 acyux
vue.js·微信小程序·uni-app
摇头的金丝猴2 天前
uniapp vue3 使用echarts-gl 绘画3d图表
前端·uni-app·echarts
小远yyds2 天前
跨平台使用高德地图服务
前端·javascript·vue.js·小程序·uni-app
qq22951165022 天前
uniapp+vue加油服务系统 微信小程序
vue.js·微信小程序·uni-app
重生之我是菜鸡程序员2 天前
uniapp 使用vue/pwa
javascript·vue.js·uni-app