效果:



步骤:

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图标的更多相关文章

  1. 【微信小程序项目实践总结】30分钟从陌生到熟悉 web app 、native app、hybrid app比较 30分钟ES6从陌生到熟悉 【原创】浅谈内存泄露 HTML5 五子棋 - JS/Canvas 游戏 meta 详解,html5 meta 标签日常设置 C#中回滚TransactionScope的使用方法和原理

    [微信小程序项目实践总结]30分钟从陌生到熟悉 前言 我们之前对小程序做了基本学习: 1. 微信小程序开发07-列表页面怎么做 2. 微信小程序开发06-一个业务页面的完成 3. 微信小程序开发05- ...

  2. 总结微信小程序开发中遇到的坑

    总结微信小程序开发中遇到的坑,一些坑你得一个一个的跳啊,/(ㄒoㄒ)/~~ 1,页面跳转和参数传递实例 首先说一下我遇到的需求有一个我的消息页面,里面的数据都是后端返回的,返回的数据大致如下,有一个是 ...

  3. 微信小程序项目实战之豆瓣天气

    概述 微信小程序项目实战之豆瓣天气 详细 代码下载:http://www.demodashi.com/demo/10943.html 一.准备工作 1.注册微信小程序 2.在小程序设置中设置reque ...

  4. 微信小程序项目踩过的几个坑

    一.前言 近期,开始了一段辛酸的还未开始就已经结束的"创业"(参见我的第二次创业,以梦为马,莫负韶华).大体上是开发了一款微信小程序,关于创业这件事情就不细说了,本文主要介绍一下开 ...

  5. 全栈开发工程师微信小程序-上(中)

    全栈开发工程师微信小程序-上(中) width: 750rpx; 750rpx代表与屏幕等宽,rpx的缩写responsive pixel,这个单位是可以根据屏幕大小进行自适应调整的像素单位. 小程序 ...

  6. 高仿Readhub小程序 微信小程序项目【原】

    # News #### 项目介绍微信小程序项目涉及功能 https://gitee.com/richard1015/News https://github.com/richard1015/News 高 ...

  7. 微信小程序项目实战之天气预报

    概述 微信小程序项目实战之天气预报 详细 代码下载:http://www.demodashi.com/demo/10634.html 一.准备工作 1.注册微信小程序 2.注册和风天气账号 3.注册百 ...

  8. 《微信小程序项目开发实战:用WePY、mpvue、Taro打造高效的小程序》(笔记1)WePY开发环境的安装

    WePY的安装或更新都通过npm进行,全局安装或更新WePY命令行工具,使用以下命令: npm install wepy-cli -g 稍等片刻,成功安装后,即可创建WePY项目. 注意:如果npm安 ...

  9. 微信小程序项目开发实战:用WePY、mpvue、Taro打造高效的小程序》(笔记4)支持React.js语法的Taro框架

    Taro本身实现的情况类似于mpvue,mpvue的未来展望中也包含了支付宝小程序,现在的版本中,也可以使用不同的构建命令来构建出百度小程序的支持,如第10章所示,但是现在Taro先于mpvue实现了 ...

  10. 微信小程序项目使用npm安装vant-weapp的正确步骤,简单易懂!!

    微信小程序项目使用npm安装vant-weapp的正确步骤 1.在当前小程序项目目录npm init -y 构建npm项目 2.运行命令 npm install vant-weapp -S --pro ...

随机推荐

  1. [排序算法] 双向冒泡排序 (C++)

    前言 本文章是建立在冒泡排序的基础上写的,如还有对 冒泡排序 不了解的童鞋,可以看看这里哦~ 冒泡排序 C++ 双向冒泡排序原理 双向冒泡排序 的基本思想与 冒泡排序还是一样的.冒泡排序 每次将相邻的 ...

  2. 深度学习之tensorflow2实战:多输出模型

    欢迎来到CNN实战,尽管我们刚刚开始,但还是要往前看!让我们开始吧! 数据集 链接:https://pan.baidu.com/s/1zztS32iuNynepLq7jiF6RA 提取码:ilxh,请 ...

  3. 一文讲透CabloyJS全栈框架的来龙去脉

    本文受众 咱们做软件开发,就好比是建造一幢幢房屋,一座座桥梁,既可以是北方宫殿的巍峨,也可以有南方庭院的雅致,更可以是横跨群山的峻险与孤悬.那么,不同的语言.不同的框架也都由其内在的秉质吸引着一批粉丝 ...

  4. C ++:树

    C++:树 树的概念: 所谓"树"是输就结构的一种,树大概可以分为两大类: 有根树 和 无根树 有根树使有一个确定的根节点,反之为无根树 · 子节点:从树根开始,通过树边向下扩展的 ...

  5. 【Java SE】Day09 继承、super、this、抽象类

    一.继承 1.概述 多个类具有相同属性和行为,共性抽取到一个类中(父类) 父类更通用,子类更具体 2.继承后的成员变量 本类:this.成员变量名 父类:super.成员变量名 3.继承后的成员方法 ...

  6. 有来实验室|第一篇:Seata1.5.2版本部署和开源全栈商城订单支付业务实战

    在线体验:Seata实验室 一. 前言 相信 youlai-mall 的实验室大家有曾在项目中见到过,但应该都还处于陌生的阶段,毕竟在此之前实验室多是以概念般的形式存在,所以我想借着此次的机会,对其进 ...

  7. vulnhub靶场之DIGITALWORLD.LOCAL: FALL

    准备: 攻击机:虚拟机kali.本机win10. 靶机:digitalworld.local: FALL,下载地址:https://download.vulnhub.com/digitalworld/ ...

  8. 如何用 JavaScript 编写你的第一个单元测试

    前言 测试代码是使代码安全的第一步.做到这一点的最好方法之一是使用单元测试,确保应用程序中的每个小功能都能发挥其应有的作用--特别是当应用程序处于边缘情况,比如无效的输入,或有潜在危害的输入. 为什么 ...

  9. 分布式计算MapReduce究竟是怎么一回事?

    前言 如果要对文件中的内容进行统计,大家觉得怎么做呢?一般的思路都是将不同地方的文件数据读取到内存中,最后集中进行统计.如果数据量少还好,但是面对海量数据.大数据的场景这样真的合适吗?不合适的话,那有 ...

  10. Win10下SDK Manager应用程序闪退问题的解决方法

    SDK Manager闪退原因:未找到Java的正确路径 解决办法: 1.在压缩包中找到Android.bat文件,右键编辑 2.打开的Android文件内容,找到如图的几行代码 将上面的代码替换成: ...