小程序使用阿里巴巴矢量图标库

一、登录官网

www.iconfont.cn

二、在搜索框中搜索想要的图标,将鼠标移动到图标上会看到三个标记

  • 可以使用下载,直接使用:

  • 可以使用css文件使用:
    •  首先点击购物车样式的选项,而后点击下图位置:

  • 点击自己创建的项目,如果没有要创建

 

点击项目后进入下一步骤。

三、下载(复制)样式文件

点击下面:

  • 复制网页中的代码,并在小程序中 创建全局样式文件app.wxss或者app.scss
  • 然后再项目中使用text标签,通过class属性指定
<view class="info">
<text><text class="iconfont icon-tongchengpeisong"></text>同城配送</text>
<text><text class="iconfont icon-src_http___pic30photophotocn_20140223_0022006080"></text>行业龙头</text>
<text><text class="iconfont icon-shijian"></text>半小时送达</text>
<text> <text class="iconfont icon-haoping"></text>100%好评</text>
</view>
  • 那么类名怎么指定,来自咱从网站创建的app.wxss(app.scss)文件中的类名,下面展示部分:
.icon-tongchengpeisong:before {content: "\e61b";
}

四、注意点

因为阿里巴巴默认没有使用base64编码,所以导致微信小程序报错,为了去掉报错,可以修改项目设置,从新生成新的css代码:

最后点进网址,复制到自己的app.wxss中。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://xiahunao.cn/news/2990536.html

如若内容造成侵权/违法违规/事实不符,请联系瞎胡闹网进行投诉反馈,一经查实,立即删除!

相关文章

SkyWalking 自定义Span并接入告警

图容易被CSDN吞掉&#xff0c;我在掘金也发了&#xff1a;https://juejin.cn/post/7361821913398837248 我就是这么膨胀 最近在做 OpenAI API 套壳&#xff0c;当我使用 okhttp-sse 这个库进行流式内容转发的时候&#xff0c;我发现有些回调方法 SkyWalking 不能抓取到。这就…

杰发科技AC7840——CAN通信简介(7)_波形分析

参考&#xff1a; CAN总线协议_stm32_mustfeng-GitCode 开源社区 0. 简介 隐形和显性波形 整帧数据表示 1. 字节描述 CAN数据帧标准格式域段域段名位宽&#xff1a;bit描述帧起始SOF(Start Of Frame)1数据帧起始标志&#xff0c;固定为1bit显性(b0)仲裁段dentify(ID)11本数…

RabbitMQ中的交换机类型

交换机类型 可以看到&#xff0c;在订阅模型中&#xff0c;多了一个exchange角色&#xff0c;而且过程略有变化&#xff1a; Publisher&#xff1a;生产者&#xff0c;不再发送消息到队列中&#xff0c;而是发给交换机 Exchange&#xff1a;交换机&#xff0c;一方面&#xff…

记录——FPGA的学习路线

文章目录 一、前言二、编程语言2.1 书籍2.2 刷题网站2.3 仿真工具 三、基础知识3.1 专业基础课3.2 fpga相关专业知识 四、开发工具五、动手实验 一、前言 也不是心血来潮想学习fpga了&#xff0c;而是祥哥还有我一个国科大的同学都在往fpga这个方向走 并且看过我之前文章的同…

事务并发控制之说透mvcc

前言 不知道有没有人有过这样的想法&#x1f4a1;&#xff0c;为什么在MySQL中已经有了各种各样的锁了&#xff0c;还需要mvcc呢&#xff1f;如果你没有想过这个问题&#xff0c;那只能证明你真的没有想过。 但是我的建议是可以去想一下&#xff0c;如果你从来没有想过这个问…

【MyBatisPlus】一、公共字段填充配置

目录 一、实体类配置 二、配置MyBatis Plus元对象处理器 三、接口字段自动填充 在使用mybatisplus项目中设置公共字段填充&#xff0c;可以按如下进行配置 一、实体类配置 TableField(value "create_time",fill FieldFill.INSERT)private LocalDateTime createTime…

StarRocks x Paimon 构建极速实时湖仓分析架构实践

Paimon 介绍 Apache Paimon 是新一代的湖格式&#xff0c;可以使用 Flink 和 Spark 构建实时 Lakehouse 架构&#xff0c;以进行流式处理和批处理操作。Paimon 创新性地使用 LSM&#xff08;日志结构合并树&#xff09;结构&#xff0c;将实时流式更新引入 Lakehouse 架构中。 …

AM解调 FPGA(寻找复刻电赛电赛D题的)

设计平台 Quartus II10.3mif产生工具modelsimSE &#xff08;仿真用&#xff09; DDS&#xff08;直接数字式频率合成器&#xff09; 从前面的内容可知&#xff0c;我们需要产生一个载波&#xff0c;并且在仿真时&#xff0c;我们还需要一个较低频率的正弦波信号来充当我们的…

c++图论基础(1)

目录 无向图 无向图度 无向图性质 有向图 有向图度 有向图性质 图的分类&#xff1a; 稀疏图&#xff1a; 稠密图&#xff1a; 零图&#xff1a; 有向完全图&#xff1a; 无向完全图&#xff1a; 度序列&#xff1a; 图是由顶点集合(简称点集)和顶点间的边(简称边…

JSON六种值类型的写法

JSON&#xff08;JavaScript Object Notation&#xff09;是一种人类可读的文本数据格式。它源于JavaScript&#xff0c;标准开放&#xff0c;格式要求更为严格&#xff0c;独立于具体编程语言&#xff0c;常用于数据交换。 列举一段JSON数据&#xff0c;解释JSON六种值类型的…

嵌入式开发一:初识Stm32

目录 一、嵌入式简介 1.1 嵌入式概念 1.2 嵌入式系统的组成 1.3 嵌入式的分类 1.3.1 嵌入式系统的分类 1.3.2 嵌入式处理器的分类 二、单片机简介(MCU嵌入式微控制器) 2.1 单片机是什么 2.2 单片机的作用是什么 2.3 单片机的发展历程 2.4 单片机发展趋势 2.5 复杂指…

HP Pavilion Plus Laptop 16-ab0040TU原厂Win11系统

惠普HP星16-abxxxx笔记本电脑原装出厂Windows11系统镜像安装包下载&#xff0c;恢复出厂开箱状态预装OEM系统 适用型号&#xff1a; 16-ab0011TU、16-ab0040TU、16-ab0041TU、16-ab0042TU、16-ab0043TU 16-ab0044TX、16-ab0045TX、16-ab0046TX、16-ab0047TX 链接&#xff1a…

mac资源库的东西可以删除吗?提升Mac运行速度秘籍 Mac实用软件

很多小伙伴在使用mac电脑处理工作的时候&#xff0c;就会很疑惑&#xff0c;电脑的运行速度怎么越来越慢&#xff0c;就想着通过删除mac资源库的东西&#xff0c;那么mac资源库的东西可以删除吗&#xff1f;删除了会不会造成电脑故障呢&#xff1f; 首先&#xff0c;mac资源库…

Android使用ProtoBuf 适配 gradle7.5 gradle8.0

ProtoBuf 适配 Gradle7.5 gradle-wrapper.properties 配置 distributionUrlhttps\://services.gradle.org/distributions/gradle-7.5-bin.zipProject&#xff1a;build.gradle: plugins {id com.android.application version 7.4.2 apply falseid com.android.library versio…

Unreal Engine子类化系统UButton

UE系统Button点击事件无法传递参数&#xff0c;通过子类化系统Button添加自定义参数扩展实现Button点击事件参数传递点击C类文件夹&#xff0c;在右边的区域点击鼠标右键&#xff0c;在弹出的菜单中选择“新建C类”在弹出的菜单中选中“显示所有类”&#xff0c;选择Button作为…

Vscode上使用Clang,MSVC, MinGW, (Release, Debug)开发c++完全配置教程(包含常见错误),不断更新中.....

1.VSCode报错头文件找不到 clang(pp_file_not_found) 在Fallback Flags中添加 -I&#xff08;是-include的意思&#xff0c;链接你的编译器对应头文件地址&#xff0c;比如我下面的是MSVC的地址&#xff09; 问题得到解决~

uniapp-css多颜色渐变:左右+上下

案例展示 案例代码&#xff1a; 代码灵感&#xff1a;使用伪类进行处理 <view class"headBox"></view>.headBox {height: 200rpx;background: linear-gradient(to right, #D3D5F0, #F0DCF3, #F7F6FB, #DAE8F2, #E1D3EE);position: relative; }.headBox…

【论文速读】|理解基于大语言模型的模糊测试驱动程序生成

本次分享论文&#xff1a;Understanding Large Language Model Based Fuzz Driver Generation 基本信息 原文作者&#xff1a;Cen Zhang, Mingqiang Bai, Yaowen Zheng, Yeting Li, Xiaofei Xie, Yuekang Li, Wei Ma, Limin Sun, Yang Liu 作者单位&#xff1a;南洋理工大学…

13.电子产品拆解分析-插排带3USB

13.电子产品拆解分析-插排带3USB 一、功能介绍二、电路分析以及器件作用1、三个插座之间通过电线连接,总开关控制火线2、通过FSD3773低待机功耗原边反馈AC/DC驱动芯片控制5V的输出一、功能介绍 ①一键控制总电源开关;②带三路USB输出;③最大支持2500W输出,10A输出电流;④8…

排序算法-计数排序

一、计数排序 这种排序算法 是利用数组下标来确定元素的正确位置的。 如果数组中有20个随机整数&#xff0c;取值范围为0~10&#xff0c;要求用最快的速度把这20个整数从小到大进行排序。 很大的情况下&#xff0c;它的性能甚至快过那些时间复杂度为O(nlogn&#xff09;的排序。…