uni-app中使用iconfont彩色图标

uni-app中使用iconfont彩色图标

大家好,今天我们来学习一下uni-app中使用iconfont彩色图标,好好看,好好学,超详细的

第一步

首先,从iconfont官网(iconfont-阿里巴巴矢量图标库)选择自己需要的图标加入项目中,点击下载至本地,如图

在这里插入图片描述

第二步

在本地找到下载的压缩包,并解压,进入解压缩之后的文件,在地址栏中输入cmd打卡控制台(在文件夹内输入cmd可直接将路径定位到当前文件夹),如下图:

在这里插入图片描述

第三步

在控制台中输入指令:npm install -g iconfont-tools(此操作前置条件需要用户安装node.js,没有安装node环境可以参考这篇文章:Windows下安装Node.js及环境配置),按回车执行指令,如下图:

在这里插入图片描述

第四步

在控制台中输入指令:iconfont-tools,按回车执行指令,之后会以此出现下图中1-5的内容,可根据自己的需求填写相关设置,如果不填写内容,则会按照默认的信息设置, 如下图所示:

在这里插入图片描述

第五步

在完成上述操作后,可以发现在文件夹中多出了一个iconfont-weapp的文件夹(如果是默认的就是这个名称,如果不是根据自己填写的文件夹名),进入此文件夹, 如下图所示:

在这里插入图片描述

第六步

根据自己需要导入相应的css文件

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

数据库导出工具

之前根据数据库升级需求,需要导出旧版本数据(sqlserver 6.5),利用c# winfrom写了一个小工具,导出数据。 →→→→→多了不说,少了不唠。进入正题→→→→ 连接数据库:输入数据库信息 连接成功…

K8S:K8S自动化运维容器Docker集群

文章目录 一.k8s概述1.k8s是什么2.为什么要用K8S3.作用及功能4.k8s容器集群管理系统 二.K8S的特性1.弹性伸缩2.自我修复3.服务发现和复制均衡4.自动发布和回滚5.集中化配置管理和秘钥管理6.存储编排7.任务批量处理运行 三.K8S的集群架构四、K8S的核心组件1、Master组件&#xf…

前端文件、图片直传OOS、分片上传、el-upload上传(vue+elementUI)

前言:基于天翼云的面相对象存储(Object-Oriented Storage,OOS),实现小文件的直接上传,大文件的分片上传。 开发文档地址:网址 上传之前的相关操作:注册账户,创建 AccessKeyId 和 AccessSecretKey之后&…

36种水果和蔬菜识别(pytorch框架,深度卷积网络模型,可以实现照片连续识别和视频识别)

1.效果视频:36种水果和蔬菜识别(pytorch框架,深度卷积网络模型,可以实现照片连续识别和视频识别)_哔哩哔哩_bilibili 2.项目文件夹 第一个文件夹(data): 装载的是原始图像 第二个文…

移动端通讯录相关代码

vue3更新版本 附件地址 代码在附件里噜 太多了不好贴

【MYSQL】排序时 如何将0排到最后,并让其他值按正序展示?

背景:展示排名时需要1,2,3,4,5,这样展示但是有些没有排名得数据字段默认值时0,这时直接用ASC就会出现问题 实现效果 实现方式:使用MySQL的ORDER BY语句来实现。以下是一个示例的SQL查…

Python编程——深入了解不可变的元组

作者:Insist-- 个人主页:insist--个人主页 本文专栏:Python专栏 专栏介绍:本专栏为免费专栏,并且会持续更新python基础知识,欢迎各位订阅关注。 目录 一、元组是什么 二、元组的定义 1、相同类型组成元组…

中间件环境搭建配置过程解读

中间件环境搭建 目录 中间件环境搭建xampp 搭建环境Tomcat环境配置安装mysql连接mysql 问题解决 xampp 搭建环境 安装xampp服务集成环境工具 官网地址下载项目压缩包,将项目文件夹放在xampp安装目录的htdocs文件夹下初始化xampp:运行目录内的setup_xamp…

一百六十八、Kettle——用海豚调度器定时调度从Kafka到HDFS的任务脚本(持续更新追踪、持续完善)

一、目的 在实际项目中,从Kafka到HDFS的数据是每天自动生成一个文件,按日期区分。而且Kafka在不断生产数据,因此看看kettle是不是需要时刻运行?能不能按照每日自动生成数据文件? 为了测试实际项目中的海豚定时调度从…

STM32G0 定时器PWM DMA输出驱动WS2812配置 LL库

通过DMA方式输出PWM模拟LED数据信号 优点:不消耗CPU资源 缺点:占用内存较大 STM32CUBEMX配置 定时器配置 定时器通道:TIM3 CH2 分频:0 重装值:79,芯片主频64Mhz,因此PWM输出频率&#xff1a…

USRP 简介,对于NI软件无线电你所需要了解的一切

什么是 USRP 通用软件无线电外设( USRP ) 是由 Ettus Research 及其母公司National Instruments设计和销售的一系列软件定义无线电。USRP 产品系列由Matt Ettus领导的团队开发,被研究实验室、大学和业余爱好者广泛使用。 大多数 USRP 通过高速链路连接到主机&…

Lnmp架构

关闭防火墙 安装依赖包 yum -y install pcre-devel zlib-devel gcc gcc-c make 创建运行用户、组 编译安装Nginx 让系统识别nginx的操作命令 添加Nginx系统服务 vim /lib/systemd/system/nginx.service 编译安装mysql 安装Mysql环境依赖包 创建运行用户 编译安装 cd /opt …

无涯教程-机器学习 - Jupyter Notebook函数

Jupyter笔记本基本上为开发基于Python的数据科学应用程序提供了一个交互式计算环境。它们以前称为ipython笔记本。以下是Jupyter笔记本的一些功能,使其成为Python ML生态系统的最佳组件之一- Jupyter笔记本可以逐步排列代码,图像,文本,输出等内容,从而逐步说明分析过程。 它有…

Java课题笔记~ 综合案例

3.综合案例 3.1 功能介绍 以上是我们在综合案例要实现的功能。除了对数据的增删改查功能外,还有一些复杂的功能,如 批量删除、分页查询、条件查询 等功能 批量删除 功能:每条数据前都有复选框,当我选中多条数据并点击 批量删除 按…

设计模式--装饰者模式(Decorator Pattern)

一、什么是装饰者模式(Decorator Pattern) 装饰者模式(Decorator Pattern)是一种结构型设计模式,它允许你在不修改现有对象的情况下,动态地将新功能附加到对象上。这种模式通过创建一个包装类,…

新手小白想要做好跨境电商独立站,需要考虑哪些要素?

对于不少中小卖家而言,利用独立站出海已然成为下一个跨境热潮。但是采用独立站模式做出海生意前,卖家需要考虑哪些要素? 产品选择 对于国内的卖家来说,依托于国内强大的供应链优势,只要能把握住消费者心态&#xff0…

docker安装及使用-Linux

前提 确保docker支持当前系统版本,docker支持centos 7及以上版本,要求Linux内核版本不低于3.10 cat /etc/redhat-release #查看系统版本 查看内核版本三种方式 cat /proc/version uname -a uname -r 一、安装docker 0、卸载docker(根…

SpringBootWeb案例 Part 5

4. 配置文件 员工管理的增删改查功能我们已开发完成,但在我们所开发的程序中还一些小问题,下面我们就来分析一下当前案例中存在的问题以及如何优化解决。 4.1 参数配置化 在我们之前编写的程序中进行文件上传时,需要调用AliOSSUtils工具类&…

【Linux系列】使用虚拟机安装Linux系统

首发博客地址 首发博客地址[1] 系列文章地址[2] 下载虚拟机 请从官网下载: https://customerconnect.vmware.com/en/downloads/info/slug/desktop_end_user_computing/vmware_workstation_player/17_0 如需不限速下载,请关注【程序员朱永胜】并回复 1018…

【sgTransfer】自定义组件:带有翻页、页码、分页器的穿梭框组件,支持大批量数据的穿梭显示。

特性&#xff1a; 表格宽度可以自定义翻页器显示控件可以自定义列配置项可以设置显示字段列名称、宽度、字段名可以配置搜索框提示文本&#xff0c;支持搜索过滤穿梭框顶部标题可以自定义左右箭头按钮文本可以设置 sgTransfer源码 <template><div :class"$opti…