当前位置： 首页 > news >正文

微信小程序引入阿里巴巴iconfont图标并使用

news 2026/2/8 14:31:54

介绍

在小程序里，使用阿里巴巴的图标，如下所示:
在这里插入图片描述

使用方式

  1. 搜索自己需要的图标，然后将需要用到的图标加入购物车，如下图所示：
    在这里插入图片描述
  2. 去右上角，点击购物车按钮；这里第一次使用，会有三个提示，选择 添加至项目 即可。 然后选择新增按钮，新建项目名字。如下所示：
    在这里插入图片描述
  3. 跳转到项目页面，选择 下载至本地,如下所示：
    在这里插入图片描述
  4. 将下载后的压缩包，解压缩，然后将名为iconfont.css 的文件改名为 iconfont.wxss，再在小程序的项目里新增名为style 的文件夹，并在文件夹下，新增名为 iconfont 的文件夹，并将压缩包里的所有文件复制到该文件夹下。如下所示：
    在这里插入图片描述
  5. 点击阿里巴巴项目里的 unicode选项，点击下面的生成代码，然后复制代码，将该代码复制到项目里， iconfont.wxss配置中，进行替换，如下所示
    在这里插入图片描述
    在这里插入图片描述
  6. 在 app.wxss 中，导入刚刚的文件，如下所示
    在这里插入图片描述
  7. 然后就可以在页面进行使用，使用方式如下所示，加上对应的icon名称即可
<text class="iconfont icon-xihuan"></text>

相关文章：

微信小程序引入阿里巴巴iconfont图标并使用

介绍 在小程序里&#xff0c;使用阿里巴巴的图标&#xff0c;如下所示: 使用方式 搜索自己需要的图标&#xff0c;然后将需要用到的图标加入购物车&#xff0c;如下图所示&#xff1a; 去右上角&#xff0c;点击购物车按钮&#xff1b;这里第一次使用&#xff0c;会有三个提…...

编程日记 2023/10/16 18:33:20

mysql面试题49：MySQL中不同text数据类型的最大长度

该文章专注于面试&#xff0c;面试只要回答关键点即可&#xff0c;不需要对框架有非常深入的回答&#xff0c;如果你想应付面试&#xff0c;是足够了&#xff0c;抓住关键点 面试官&#xff1a;MySQL中TEXT数据类型的最大长度 在MySQL中&#xff0c;TEXT数据类型用于存储较大…...

编程日记 2023/10/16 18:31:18

从虚拟电厂在上海的实践探索看企业微电网数字化的意义

安科瑞 华楠 作为典型的人口聚集、负荷密集区域&#xff0c;上海市具有外来电比例高、本地资源禀赋不足的特点。从发电侧角度来看&#xff0c;近年来上海风、光等新能源发电装机比例逐年提升&#xff0c;传统的火电逐渐成为调节性发电资源&#xff1b;从负荷侧角度来看上海以第…...

编程日记 2023/10/16 18:30:17

创建并初始化线程池

创建并初始化线程池–》threadpool.h, 创建并初始化&脱离(执行完后)子线程&#xff0c;每个子线程信号量wait阻塞【1】 创建套接字&#xff1a;int listenfd socket( PF_INET, SOCK_STREAM, 0 ); 端口复用&#xff1a;setsockopt( listenfd, SOL_SOCKET, SO_REUSEADDR, &a…...

编程日记 2023/10/16 18:29:16

【LeetCode热题100】--136.只出现一次的数字

136.只出现一次的数字 使用哈希表&#xff1a; class Solution {public int singleNumber(int[] nums) {Map<Integer,Integer> map new HashMap<>();for(int num:nums){Integer count map.get(num);if(count null){count 1;}else{count;}map.put(num,count);}…...

编程日记 2023/10/16 18:28:15

Java idea查看自定义注解的调用地方

Java idea查看自定义注解的调用地方...

编程日记 2023/10/16 18:27:13

ReLU激活函数

LeakyReLU激活函数的具体用法请查看此篇博客&#xff1a;LeakyReLU激活函数 ReLU&#xff08;Rectified Linear Unit&#xff09;激活函数是深度学习中最常用的激活函数之一&#xff0c;它的数学表达式如下&#xff1a; 在这里&#xff0c;(x) 是输入&#xff0c;(f(x)) 是输…...

编程日记 2023/10/16 18:26:12

【Android】adjustViewBounds 的理解和使用

理解 adjustViewBounds 是一个 ImageView 的属性&#xff0c;用于调整 ImageView 的边界以适应图像的尺寸。当设置为 true 时&#xff0c;ImageView 的边界将根据图像的宽高比例进行调整&#xff0c;以确保图像完全显示在 ImageView 内部。 理解和使用 adjustViewBounds 的步…...

编程日记 2023/10/16 18:25:10

Redis知识补充

大key删除 unLink scan分批删除 渐进式rehash Redis笔记&#xff1a;Redis的字典什么时候进行Rehash&#xff1f;_redis什么时候进行rehash-CSDN博客...

编程日记 2023/10/16 18:24:10

IIS 部署.NetCore，最细步骤

服务器安装环境 将.net core程序部署到IIS总体需要经过以下3个大步骤&#xff0c;其中在IIS上配置网站有些比较繁琐&#xff0c;我都会逐一给出详细步骤。 <1>安装IIS和.NetCORE运行时程序 <2>以文件的形式发布.NETCORE程序到指定目录 <3>IIS上面建立网站…...

编程日记 2023/10/16 18:23:09

4.查询用户的累计消费金额及VIP等级

思路分析&#xff1a; &#xff08;1&#xff09;按照user_id及create_date 分组求消费金额total_amount &#xff08;2&#xff09;开窗计算同user_id下的累计销售金额sum(total_amount) over(partition by user_id order by create_date ROWS BETWEEN UNBOUNDED PRECEDING AN…...

编程日记 2023/10/16 18:22:08

解决MySQL错误-this is incompatible with sql_mode=only_full_group_by

报错 Expression #1 of SELECT list is not in GROUP BY clause and contains nonaggregated column ‘数据库名.表名.字段名’ which is not functionally dependent on columns in GROUP BY clause; this is incompatible with sql_modeonly_full_group_by 原因 MySQL错误-t…...

编程日记 2023/10/16 18:21:07

UDP通信-广播、组播

UDP的三种通信方式 单播&#xff1a;单台主机与单台主机之间的通信。 广播&#xff1a;当前主机与所在网络中的所有主机通信。 组播&#xff1a;当前主机与选定的一组主机的通信。 UDP如何实现广播 使用广播地址&#xff1a;255.255.255.255 具体操作&#xff1a; 发送端…...

编程日记 2023/10/16 18:20:03

10-bean创建流程1一finishBeanFactoryInitialization(ConfigurableListableBeanFactory

文章目录 1. 方法的主要流程2. ConversionService-如何自定义转换器3. AbstractBeanFactory#getMergedLocalBeanDefinition(String beanName)4.FactoryBean实例化5.内置值处理器1. 方法的主要流程 /*** Finish the initialization of this contexts bean factory,* initializi…...

编程日记 2023/10/16 18:19:02

专题三：穷举、暴搜、深搜、回溯、剪枝【递归、搜索、回溯】

1、全排列 class Solution { public:vector<vector<int>> ret;vector<int> path;bool check[7];void dfs(vector<int>& nums){if(nums.size() path.size()) {ret.push_back(path);return;}for(int i 0;i < nums.size();i){if(check[i] fals…...

编程日记 2023/10/16 18:18:01

国科云SSL证书讲堂：SSL证书安装常见问题盘点

SSL证书能够对网站传输数据进行加密处理&#xff0c;有效提升网站的数据安全防护能力&#xff0c;逐渐被越来越多的政企网站所应用。但在安装使用SSL证书时&#xff0c;经常会发生各种意想不到的问题&#xff0c;对网站的数据安全和正常访问造成严重影响。本文国科云对安装使用…...

编程日记 2023/10/16 18:17:00

Python3无法调用Sqlalchemy解决(mysqldb)

原因 在安装Sqlalchemy后运行程序报错 无法导入mysqldb&#xff0c;缺失模块 ImportError: No module named ‘MySQLdb’ 既然缺少 MySQLdb 这个模块&#xff0c;尝试按照正常的想法执行 pip install MySQLdbpip install mysql-python 应该能解决&#xff0c;但是却找不到…...

编程日记 2023/10/16 18:15:59

2023/10/15总结

学习总结 最近开始写项目了&#xff0c;然后写的过程中遇到了跨域问题。 为什么会出现跨域问题 由于浏览器的同源策略限制。同源策略是一种约定&#xff0c;它是浏览器最核心也是最基本的安全功能。如果缺少了同源策略&#xff0c;那么浏览器的正常功能可能都会收到影响。所谓…...

编程日记 2023/10/16 18:14:59

关于图像分割SDK的一些基础认识

随着科技的不断发展&#xff0c;图像分割SDK已经成为了一个备受关注的话题。而在众多图像分割SDK中&#xff0c;美摄图像分割SDK以其独特的功能和优势脱颖而出。本文将从美摄图像分割SDK的企业价值和互联网娱乐方面&#xff0c;介绍其宣传文章的具体写作规范。 在企业价值方面&…...

编程日记 2023/10/16 18:13:58

SpringMVC之国际化上传下载

spring项目中的国际化 1&#xff09;提供中英两种资源文件 i18n_en_US.properties i18n_zh_CN.properties 2&#xff09;配置国际化资源文件&#xff08;在spring配置文件中添加&#xff0c;例如spring-mvc.xml&#xff09; <bean id"messageSource" class&quo…...

编程日记 2023/10/16 18:12:56

synchronized 学习

学习源&#xff1a; https://www.bilibili.com/video/BV1aJ411V763?spm_id_from333.788.videopod.episodes&vd_source32e1c41a9370911ab06d12fbc36c4ebc 1.应用场景 不超卖&#xff0c;也要考虑性能问题&#xff08;场景&#xff09; 2.常见面试问题&#xff1a; sync出…...

编程新知 2025/12/14 17:38:17

【解密LSTM、GRU如何解决传统RNN梯度消失问题】

解密LSTM与GRU&#xff1a;如何让RNN变得更聪明&#xff1f; 在深度学习的世界里&#xff0c;循环神经网络&#xff08;RNN&#xff09;以其卓越的序列数据处理能力广泛应用于自然语言处理、时间序列预测等领域。然而&#xff0c;传统RNN存在的一个严重问题——梯度消失&#…...

编程新知 2025/12/24 1:45:14

家政维修平台实战20：权限设计

目录 1 获取工人信息2 搭建工人入口3 权限判断总结 目前我们已经搭建好了基础的用户体系&#xff0c;主要是分成几个表&#xff0c;用户表我们是记录用户的基础信息&#xff0c;包括手机、昵称、头像。而工人和员工各有各的表。那么就有一个问题&#xff0c;不同的角色&#xf…...

编程新知 2026/2/1 22:23:58

【AI学习】三、AI算法中的向量

在人工智能&#xff08;AI&#xff09;算法中&#xff0c;向量&#xff08;Vector&#xff09;是一种将现实世界中的数据&#xff08;如图像、文本、音频等&#xff09;转化为计算机可处理的数值型特征表示的工具。它是连接人类认知&#xff08;如语义、视觉特征&#xff09;与…...

编程新知 2026/1/1 14:01:45

微信小程序云开发平台MySQL的连接方式

注&#xff1a;微信小程序云开发平台指的是腾讯云开发 先给结论&#xff1a;微信小程序云开发平台的MySQL&#xff0c;无法通过获取数据库连接信息的方式进行连接&#xff0c;连接只能通过云开发的SDK连接&#xff0c;具体要参考官方文档&#xff1a; 为什么&#xff1f; 因为…...

编程新知 2026/2/1 5:24:17

【JavaSE】绘图与事件入门学习笔记

-Java绘图坐标体系 坐标体系-介绍 坐标原点位于左上角&#xff0c;以像素为单位。 在Java坐标系中,第一个是x坐标,表示当前位置为水平方向&#xff0c;距离坐标原点x个像素;第二个是y坐标&#xff0c;表示当前位置为垂直方向&#xff0c;距离坐标原点y个像素。 坐标体系-像素 …...

编程新知 2025/12/19 20:46:15

C# 求圆面积的程序（Program to find area of a circle）

给定半径r&#xff0c;求圆的面积。圆的面积应精确到小数点后5位。 例子&#xff1a; 输入&#xff1a;r 5 输出&#xff1a;78.53982 解释&#xff1a;由于面积 PI * r * r 3.14159265358979323846 * 5 * 5 78.53982&#xff0c;因为我们只保留小数点后 5 位数字。 输…...

编程新知 2026/2/8 9:34:11

算法：模拟

1.替换所有的问号 1576. 替换所有的问号 - 力扣&#xff08;LeetCode&#xff09; ​遍历字符串​&#xff1a;通过外层循环逐一检查每个字符。​遇到 ? 时处理​&#xff1a; 内层循环遍历小写字母&#xff08;a 到 z&#xff09;。对每个字母检查是否满足&#xff1a; ​与…...

编程新知 2026/1/25 10:01:01

处理vxe-table 表尾数据是单独一个接口，表格tableData数据更新后，需要点击两下，表尾才是正确的

修改bug思路&#xff1a; 分别把 tabledata 和 表尾相关数据 console.log() 发现 更新数据先后顺序不对 settimeout延迟查询表格接口 ——测试可行 升级↑&#xff1a;async await 等接口返回后再开始下一个接口查询 ________________________________________________________…...

编程新知 2026/1/25 6:16:49

苹果AI眼镜：从“工具”到“社交姿态”的范式革命——重新定义AI交互入口的未来机会

在2025年的AI硬件浪潮中，苹果AI眼镜（Apple Glasses）正在引发一场关于“人机交互形态”的深度思考。它并非简单地替代AirPods或Apple Watch，而是开辟了一个全新的、日常可接受的AI入口。其核心价值不在于功能的堆叠，而在于如何通过形态设计打破社交壁垒，成为用户“全天佩戴…...

编程新知 2025/12/22 12:09:15