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.hqwc.cn/news/227845.html

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

相关文章

ubuntu改window任务栏

经常在ubuntu和win之间切换&#xff0c;任务栏的布局不统一会让人很别扭&#xff0c;个人很喜欢win任务栏的不折叠图标功能&#xff0c;而ubuntu没有&#xff0c;又很喜欢的ubuntu的多工作空间&#xff0c;效率比副屏还高&#xff0c;还可以自定义切换工作空间的快捷键。鱼和熊…

成功的蓝图:实现长期成长与卓越表现的 6 项策略

能在收入和利润上持续领先同行的公司寥寥无几&#xff0c;不到四分之一。McKinsey的最新研究揭示了这些增长标杆公司与众不同的六大心态和策略。过度谨慎的公司&#xff0c;尤其在动荡时期&#xff0c;也许能捱过当下&#xff0c;但往往无法发掘全部潜力。考虑到近五年历经前所…

Ps:子路径的上下排列以及对齐与分布

不论是一个形状图层&#xff08;或图层的矢量蒙版&#xff09;上的多个形状还是同一路径层上多个路径&#xff0c;只要对应“路径”面板的一个路径层&#xff0c;可以将这些路径称为该路径层的“子路径”&#xff0c;也称为“组件”。 当一个路径层上有两个以上的子路径时&…

day64 django中间件的复习使用

django中间件 django中间件是django的门户 1.请求来的时候需要先经过中间件才能达到真正的django后端 2.响应走的时候也需要经过中间件 ​ djangp自带七个中间件MIDDLEWARE [django.middleware.security.SecurityMiddleware,django.contrib.sessions.middleware.SessionMiddle…

Python基础语法之学习运算符

Python基础语法之学习运算符 一、代码二、效果 一、代码 print("1 1 ", 1 1) print("1 - 1 ", 1 - 1) print("1 * 1 ", 1 * 1) print("11 / 5 ", 11 / 5) print("11 // 5 ", 11 // 5) print("9 % 5 ", 9…

pycharm右键执行,出现Run ‘Python tests in xxx‘的问题

1.问题描述 用pytest框架写了一个python的模块&#xff0c;右键执行时发现&#xff0c;执行的模块显示有问题&#xff0c;如下图所示 2.解决问题 Python tests这表示&#xff0c;当前运行的代码文件进入了pytest模式&#xff0c;pytest模式不同于run模式&#xff0c;因为运行…

Elasticsearch 线上实战问题及解决方案探讨

1、reindex相关问题 1.1 问题描述 我有 1tb 的一个大索引若干&#xff0c;要迁移到另外一个新集群去&#xff0c;有没有好办法&#xff1f;reindex好像会中断...... reindex 是不是就算设置了频率也会莫名的中断&#xff0c;而且没地方查到错误&#xff1f;1000多万的数据&…

【用unity实现100个游戏之17】从零开始制作一个类幸存者肉鸽(Roguelike)游戏4(附项目源码)

文章目录 本节最终效果前言命中敌人闪白和击退效果敌人死亡效果等级 击杀数 经验绘制经验条显示等级和杀敌数游戏倒计时玩家血条参考源码完结 本节最终效果 前言 本节紧跟着上一篇&#xff0c;主要实现敌人受击死亡效果特效&#xff0c;主角等级、击杀数、经验、血条UI显示。 …

SpringBoot : ch09 整合Redis

前言 当你的应用程序需要一个快速、可扩展的内存数据库时&#xff0c;Redis是一个非常流行的选择。通过将Redis与Spring Boot集成&#xff0c;你可以轻松地利用Redis的功能&#xff0c;例如缓存、会话存储和消息队列等&#xff0c;从而提升应用程序的性能和可伸缩性。 在本教…

使用Pytorch从零开始构建扩散模型-DDPM

知识回顾: [1] 生成式建模概述 [2] Transformer I&#xff0c;Transformer II [3] 变分自编码器 [4] 生成对抗网络&#xff0c;高级生成对抗网络 I&#xff0c;高级生成对抗网络 II [5] 自回归模型 [6] 归一化流模型 [7] 基于能量的模型 [8] 扩散模型 I, 扩散模型 II 引言 去噪…

Unity之ARFoundation如何实现BodyTracking人体跟踪

前言 ARBodyTracking,就是指通过手机AR扫描并精确的捕获人物的肢体部位的技术。如下图所示 这项技术目前是有苹果的ARKit提供,苹果的body tracking 功能需要使用配备 TrueDepth 摄像头的设备,配备 A12 仿生芯片、运行 iOS 13 或更高版本的设备,比如 iPhone X 及更新机型。…

群晖NAS配置之自有服务器ngrok实现内网穿透

群晖NAS配置之自有服务器ngrok实现内网穿透 前言-内网穿透 内网穿透是指通过一种技术让外部网络可以访问到内网的NAS设备&#xff0c;这样即使在不同网络环境下&#xff0c;也能够远程访问和管理NAS设备。以下是一些常见的内网穿透方案&#xff1a; Synology官方提供的Quick…