iconfont 使用彩色图标

1、下载iconfont到本地

2、全局安装 iconfont-tools 

npm install -g iconfont-tools

3、在iconfont解压目录下执行命令、一直回车

iconfont-tools

4、文件拷贝

        执行完上述命令后会生成iconfont-weapp目录,将iconfont-weapp目录下的iconfont-weapp- icon.css文件拷贝至iconfont目录下

5、项目mian.js中文件引入文件

import '@/assets/iconfont/iconfont.css'
import '@/assets/iconfont/iconfont-weapp-icon.css'

6、项目中使用

<!-- 彩色图标 -->
<i class="t-icon t-icon-tdt ticon"></i>
<!-- 矢量图标 -->
<i class="iconfont icon-location icon"></i>

7、效果预览 

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

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

相关文章

【23真题】比985还难的双非!

今天分享的是23年长春工业大学807的信号与系统试题及解析。 本套试卷难度分析&#xff1a;本套试题难度中等偏上&#xff0c;题量不少&#xff0c;难度不小&#xff01;状态方程考察的淋漓尽致。另外还有电路题。这所双非院校的真题比90%的211难&#xff0c;甚至比一部分985更…

接手了一个外包开发的项目,我感觉我的头快要裂开了~

嗨&#xff0c;大家好&#xff0c;我是飘渺。 最近&#xff0c;我和小伙伴一起接手了一个由外包团队开发的微服务项目&#xff0c;这个项目采用了当前流行的Spring Cloud Alibaba微服务架构&#xff0c;并且是基于一个“大名鼎鼎”的微服务开源脚手架&#xff08;附带着模块代…

【工具使用】Keil常用的调试操作整理介绍

目录 一、软件调试使用 1.1 基本调试操作 1.2 调试窗口 二、注意事项 一、软件调试使用 1.1 基本调试操作 上文已经说过在线调试和模拟调试的配置过程&#xff0c;但无论是在线还是模拟调试&#xff0c;调试技巧工具的使用都是一样的。 点击红色d&#xff0c;进入调试 可…

C++ 红黑树的封装

一.map/set的封装 在实现了红黑树的部分功能后&#xff0c;我们可以便可以将红黑树作为底层结构来封装map 和 set &#xff0c;但是问题也随之而来。我们都知道map是k-v的数据模型&#xff0c;而set是k的数据模型&#xff0c;我们难道要去使用两棵红黑树来封装吗&#xff1f;显…

Centos7安装配置nginx

快捷查看指令 ctrlf 进行搜索会直接定位到需要的知识点和命令讲解&#xff08;如有不正确的地方欢迎各位小伙伴在评论区提意见&#xff0c;小编会及时修改&#xff09; Centos7安装配置nginx Nginx介绍 Nginx (engine x) 是一个高性能的 HTTP 和 反向代理 服务&#xff0c;也…

使用MAT分析内存泄漏(mac)

前言 今天主要简单分享下Eclipse的Memory Analyzer在mac下的使用。 一、Mat&#xff08;简称&#xff09;干什么的&#xff1f; 就是分析java内存泄漏的工具。 二、使用步骤 1.下载 mac版的现在也分芯片&#xff0c;别下错了。我这里是M2芯片的&#xff0c;下载的Arch64的。 …

在Mysql中,什么是回表,什么是覆盖索引,索引下推?

一、什么是回表查询&#xff1f; 通俗的讲就是&#xff0c;如果索引的列在 select 所需获得的列中&#xff08;因为在 mysql 中索引是根据索引列的值进行排序的&#xff0c;所以索引节点中存在该列中的部分值&#xff09;或者根据一次索引查询就能获得记录就不需要回表&#x…

WPF前端实现人脸扫描动画效果

前言 本章实现的效果主要通过OpacityMask与LinearGradientBrush(径向渐变) 的组合应用来实现。最终实现效果如下: LinearGradientBrush线性渐变画刷 LinearGradientBrush其实很简单,我们只需要关注5个属性,使用这5个属性你就可以完成这个画刷几乎所有的变化。 属性介…

FOC系列(三)----AS5600磁编码器

一、 关于AS5600 1.1 芯片内部框图和引脚功能介绍 具体的内容大家可以查看数据手册&#xff1a;AS5600数据手册&#xff0c;在这里只是对一下重要的地方进行说明。    系统框图如下&#xff1a;    电源设计选项&#xff0c;我在设计时选择的是第二种电源方案&#xff0c…

推荐6款交互设计软件,助你事半功倍!

交互软件可以帮助设计师从“可用性”和“用户体验”的角度优化他们的作品。如果设计师想创建一个令人满意的交互设计作品&#xff0c;一个方便的交互设计软件是必不可少的。当然&#xff0c;交互软件只是我们实现目标的一种手段。根据设计师的个人喜好和方便&#xff0c;选择易…

可以免费使用的Axure在线版来了

Axure作为一种功能强大的原型设计工具&#xff0c;一直受到设计师的青睐。然而&#xff0c;其高昂的价格可能成为一个门槛&#xff0c;限制了一些设计师的选择。但不用担心&#xff0c;现在有一个免费的Axure在线工具即时设计&#xff0c;功能更完整&#xff0c;更划算&#xf…

基于字面的文本相似度计算和匹配搜索

搜索推荐系统专栏简介:搜索推荐全流程讲解(召回粗排精排重排混排)、系统架构、常见问题、算法项目实战总结、技术细节以及项目实战(含码源) 专栏详细介绍:搜索推荐系统专栏简介:搜索推荐全流程讲解(召回粗排精排重排混排)、系统架构、常见问题、算法项目实战总结、技术…

基于PaddleOCR银行卡识别实现(三)

前言 基于PaddleOCR银行卡识别实现&#xff08;一&#xff09; 基于PaddleOCR银行卡识别实现&#xff08;二&#xff09; 前两篇文章讲了检测模型和识别模型的实现&#xff0c;这一篇文章姗姗来迟&#xff0c;将讲解下两个模型的串联应用和PaddleOCR的源码精简&#xff0c;下面…

陪诊系统:基于自然语言处理的患者沟通创新

医疗领域的数字化转型正日益引入创新技术&#xff0c;其中基于自然语言处理&#xff08;NLP&#xff09;的陪诊系统成为提升患者沟通的一项关键技术。本文将深入研究这一领域&#xff0c;介绍陪诊系统如何借助NLP实现患者沟通的创新&#xff0c;并提供一个简单的Python代码示例…

VUE本地idea启动

安装yarn&#xff08;也可以用npm&#xff09; 问题&#xff1a;yarn : 无法加载文件 C:\Users\xx/yarn.ps1&#xff0c;因为在此系统上禁止运行脚本 解决办法&#xff1a;管理员身份运行【 PowerShell】&#xff0c;然后执行【Set-ExecutionPolicy RemoteSigned】&#xff0c…

onnx快速部署YOLO模型

1、准备和环境 首先需要将yolov5模型训练好的最佳权重文件转化为.onnx格式以备使用。不会的小伙伴可以参考yolov5的官方文档&#xff0c;使用yolov5官方的 export.py 脚本进行转换&#xff0c;或者参考一些博客链接&#xff0c;这里不做详细解析。  基本环境配置&#xff0c;相…

谱方法学习笔记-上(超详细)

谱方法学习笔记&#x1f4d2; 谱方法学习笔记-下(超详细) 声明&#xff1a;鉴于CSDN使用 K a T e X KaTeX KaTeX 渲染公式&#xff0c; KaTeX \KaTeX KATE​X 与 L a T e X LaTeX LaTeX 不同&#xff0c;不支持直接的交叉引用命令&#xff0c;如\label和\eqref。 KaTeX \KaT…

详解STUN与TR111

STUN协议定义了三类测试过程来检测NAT类型&#xff1a; Test1&#xff1a;STUN Client通过端口{IP-C1:Port-C1}向STUN Server{IP-S1:Port-S1}发送一个Binding Request&#xff08;没有设置任何属性&#xff09;。STUN Server收到该请求后&#xff0c;通过端口{IP-S1:Port-S1}把…

【区块链】产品经理的NFT初探

常见的FT如比特币&#xff08;BTC&#xff09;&#xff0c;以太币&#xff08;ETH&#xff09;等&#xff0c;两个代币之间是完全可替换的。而NFT具有唯一性&#xff0c;不可以互相替换。本文作者对NET的发展现状、相关协议、应用场景等方面进行了分析&#xff0c;一起来看一下…

论如何让Spring Boot在高压力环境下依然与众不同

文章目录 &#x1f50a;博主介绍&#x1f964;本文内容调优线程池优化线程池配置多样化设备支持分布式控制同步编程 &#x1f4e2;文章总结&#x1f4e5;博主目标 &#x1f50a;博主介绍 &#x1f31f;我是廖志伟&#xff0c;一名Java开发工程师、Java领域优质创作者、CSDN博客…