uni-app引用外部图标库(阿里矢量图)

news2024/12/26 22:41:33

uni-app引用外部图标库(阿里矢量图)

作为前端程序员,nui-app是必备的,但是有时候内置的图标,组件又不完全满足,这里就可以引进外部图标,这里引用的是阿里矢量图标

第一步,在项目目录中新建文件夹,如图

第二步,登上阿里矢量图官网,将自己需要的图片先加入购物车,再点击右上角购物车 

 

 

第三部,将下载好的压缩包解压,打开文件,将 iconfont.css 和 iconfont.ttf 两个文件复制到新建的icon文件夹下 

第四步,回到阿里官网,进入购物车,将刚刚加的图标添加项目,没有可新建,这个无所谓 

 第五步,打开 iconfont.css ,将@font-face内容替换掉,并在//前加 https: ,替换好后如下图

 

第六部,页面应用

 

 效果图:

 

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

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

相关文章

(树) 剑指 Offer 32 - III. 从上到下打印二叉树 III ——【Leetcode每日一题】

❓剑指 Offer 32 - III. 从上到下打印二叉树 III 难度:中等 请实现一个函数按照之字形顺序打印二叉树,即第一行按照从左到右的顺序打印,第二层按照从右到左的顺序打印,第三行再按照从左到右的顺序打印,其他行以此类推…

JVM深入 —— JVM的体系架构

前言 能否真正理解JVM的底层实现原理是进阶Java技术的必由之路,Java通过JVM虚拟机的设计使得Java的延拓性更好,平台无关性是其同时兼顾移动端和服务器端开发的重要特性。在本篇文章中,荔枝将会仔细梳理JVM的体系架构和理论知识,希…

547. 省份数量

有 n 个城市,其中一些彼此相连,另一些没有相连。如果城市 a 与城市 b 直接相连,且城市 b 与城市 c 直接相连,那么城市 a 与城市 c 间接相连。 省份 是一组直接或间接相连的城市,组内不含其他没有相连的城市。 给你一…

026 - sum()函数

SUM() 函数: SUM 函数返回数值列的总数(总额)。 SQL SUM() 语法: SELECT SUM(column_name) FROM table_name -- 实际操作(计算salary总额) : SELECT SUM(salary) FROM employee; -- 查询ti…

代码随想录—力扣算法题:704二分查找.Java版(示例代码与导图详解)

版本说明 当前版本号[20230802]。 版本修改说明20230802初版 目录 文章目录 版本说明目录数组数组理论基础二分查找思路左闭右闭[left, right]左闭右开[left, right)两种方法的区别总结 数组 数组理论基础 数组是存放在连续内存空间上的相同类型数据的集合。 数组可以方便…

Python集成开发环境IDE:Spyder自动换行、函数列表outline、代码折叠

Spyder是一个用PythonQt编写的集成开发环境,包含许多有用的函数和工具。以下是一些常用功能: 变量浏览器:可以动态交互并修改变量,可以进行绘制直方图、时间序列,编辑日期框架或Numpy数组,对集合进行排序&…

100 个鲜为人知的 Python 高级技巧 0-20

100 鲜为人知的 Python 功能 这篇文章是为那些每天使用 Python,但从未真正坐下来通读所有文档的人准备的。 如果您已经使用 Python 多年,并且知道足够多的知识来完成工作,那么为了发现一些新技巧而通读几千页的文档可能不是明智之举。 因此&a…

IPC进程间通信探索——管道的原理与特点

🤣 爆笑教程 👉 《看表情包学Linux》 🔥 CSDN 累计订阅量破千的火爆 C/C 教程的 2023 重制版,C 语言入门到实践的精品级趣味教程。了解更多: 👉 "不太正经" 的专栏介绍 ← 试读第一章订阅链接&am…

Babel编译与Webpack

目录 Babel初识BabelBabel 使用方式使用 Babel 前的准备工作 WebpackWebpack介绍Webpack初体验Webpack核心概念入口(entry)出口(output)加载 (loader)插件(plugins) Babel Babel官网: https://babeljs.io/…

贝锐蒲公英:没有公网IP,多分支企业如何高效远程访问OA系统?

贝锐蒲公英:没有公网IP,多分支企业、移动办公人员如何高效远程访问OA系统? 国内某大型美妆公司,旗下产品覆盖美容护肤品、彩妆、美容仪器、健康食品、SPA美容会所及等多类服务,致力于为客户提供高品质的产品和完善的服…

Centos7搭建Apache Storm 集群运行环境

文章目录 1. 安装 Java2. 下载并解压 Storm3. 配置环境变量4. 配置 ZooKeeper5. 配置 Stormstorm.yaml自定义 storm.yamlstorm-env.shlogback/cluster.xml 6. 启动 Storm 集群7. 验证 1. 安装 Java Storm 运行在 Java 平台上,因此需要先安装 Java。你可以使用以下命…

C++ 类的友元

【例1】 将数据与处理数据的函数封装在一起,构成类,既实现了数据的共享又实现了隐藏,无疑是面向对象程序设计的一大优点。但是封装并不总是绝对的。现在考虑一个简单的例子,就是Point类,每一个Point类的对象代表一个“…

《零基础入门学习Python》第075讲:GUI的终极选择:Tkinter12

Tkinter 的基本组件我们已经介绍得七七八八了,剩下的一些我们在这节课全部都会讲解完毕。 (一)Message组件 Message(消息)组件是 Label 组件的变体,用于显示多行文本消息。众所周知,我们的Lab…

简单的Kubernetes集群二进制方式部署

Kubernetes二进制方式部署 一:操作系统初始化配置(所有机子)关闭防火墙关闭selinux关闭swap根据规划设置主机名在master添加hosts调整内核参数时间同步 二:部署 etcd 集群1.准备签发证书环境#准备cfssl证书生成工具生成Etcd证书编…

在SIP 语音呼叫中出现单通时要怎么解决?

在VoIP的环境中,特别是基于SIP通信的环境中,我们经常会遇到一些非常常见的问题,例如,单通,注册问题,回声,单通等。这些问题事实上都有非常直接的排查方式和解决办法,用户可以按照一定…

Quartz中集群模式源码级解析

文章目录 案例搭建 案例搭建 创建一个JOB实现类 package org.quartz.examples.example13;import org.quartz.*;import java.util.Date;/*** This job has the same functionality of SimpleRecoveryJob except that this job implements is stateful, in that it* will have …

Spring框架——IOC配置文件方式

Spring框架的概述和入门 目录 Spring框架的概述和入门 什么是Spring框架 Spring框架的特点 Spring框架的IOC核心功能快速入门 Spring框架中的工厂(了解) Spring 创建Bean对象的三种方式 Spring框架的Bean管理的配置文件方式 Spring框架中标签的配…

Token与Cookie、Session登录机制

Cookie 背景 Web 的兴起(所谓交互式就是你不光可以浏览,还可以登录,发评论,购物等用户操作的行为),单纯地浏览 web 已经无法满足人们的要求,比如随着网上购物的兴起,需要记录用户的…

寻找丢失数字:数学与位运算的解密之旅

本篇博客会讲解力扣“268. 丢失的数字”的解题思路,这是题目链接。 注意进阶中的描述:你能否实现线性时间复杂度、仅使用额外常数空间的算法解决此问题?这里我会讲解两种思路,它们的时间复杂度是O(N),空间复杂度是O(1)…

STM32F1基于标准库ST7735 1.8‘‘LCD显示DHT11数据

STM32基于标准库ST7735 1.8‘’LCD显示DHT11数据 📍HAL库驱动可以参考:《STM32基于HAL工程读取DHT11数据》🌼显示效果: 🌻ST7735 128x160 1.8’LCD屏幕 📌屏幕资料和相关驱动可以参考《1.8寸TFT LCD128…