微信小程序项目中使用icon图标

效果：

步骤：
1、先让ui负责人把你的账号加入到项目中，加入到项目中后就可以在icon图标库中看到该项目

2、在小程序中使用
新建一个view，在上面加一个class，复制icon名字上去即可，注意格式，格式为iconfont icon名。

iconfont这个前缀不是固定的，根据icon名字来，icon的前缀为my-icon-xxxx，那么前缀就是 my-icon
没有前缀或者设置了前缀，一般都是使用iconfont，根据项目视情况而定，这里以my-icon举例。
my-icon my-icon-fontxxx // 前缀 icon名

// 使用icon<view class="fontxxx my-icon my-icon-fontxxx "></view>// 设置icon样式.fontxxx {font-size:30rpx;color:blue;}

上面演示的是已经引入了icon的情况，如果没有引入则需要在iconfont图标库下载图标至本地，然后将文件内部的iconfont.css更名为iconfont.wxss，放入到根文件夹的style中即可正常使用。

微信小程序项目中使用icon图标相关推荐

微信小程序项目中JSON文件的作用详解
在微信小程序开发项目中,会包含多个JSON文件,不同的JSON文件会有不同的作用,下面就微信小程序开发中的json文件进行说明. JSON配置文件: json 是一种数据格式,在实际开发中,json总 ...
微信小程序9---Button按钮和icon图标
Button 按钮首先提醒一下大家,如果你现在button标签不能用,不用担心,那是因为微信小程序存在一个bug,你仔细看一下你的button标签的代码是不是这样的 <button>Co ...
在微信小程序项目中使用mock模拟数据
之前对mockjs做了一个介绍,以及在js.vue中拦截ajax的方法,介绍是必看的,也是一些基础 mockjs介绍总结 mockjs拦截ajax 在vue项目中使用mock拦截axios请求这一篇 ...
微信小程序 wx.showToast() 更换icon图标
image换成自己本地的图片就可以了. wx.showToast({ title:"成功", icon: 'success', image: '-/-/img/warn.png', ...
微信小程序wx.showToast修改icon图标
wx.showToast({title:"成功",icon: 'success',image: '../../images/fail.png',duration: 2000,mas ...
微信小程序开发：使用字体图标的方法
在微信小程序开发过程中,图标的使用是很常见很普遍的.一般情况下,在微信小程序项目的文件目录里面images里面,可以直接引用本地的图标文件,但是通过使用字体图标或者background设置背景图的时候 ...
微信小程序开发过程中出现的内存泄漏问题
微信小程序开发过程中出现的内存泄漏问题问题描述微信小程序项目中,有两个页面多次来回切换,(我这个项目数因为有再来一次,和回顾本次的功能所以要在答题页和分数页来回切换)就会报错 VM333 ...
uniapp微信小程序项目-优购商城
原网页笔记文档: https://www.escook.cn/docs-uni-shop/ 1. 起步 #1.1 uni-app 简介 uni-app 是一个使用 Vue.js 开发所有前端应用的框架 ...
手把手带你学习微信小程序 —— 项目实战篇
微信小程序项目实战篇 WeChat-applet 1.支付宝界面展示 2.微博发帖功能实现 3.时间格式化案例 4.微信红包界面展示 5.微信消息删除案例 6.微信icon 组件 6.1 支付成功界面 ...

微信小程序项目中使用icon图标

微信小程序项目中使用icon图标相关推荐

最新文章

热门文章