uni-app使用iconfont字体图标

news2024/10/6 22:31:12

先iconfont选择好自己需要的图标 添加至项目 下载字体文件到本地

在这里插入图片描述

将下载的文件解压缩到工程目录static文件夹下

在这里插入图片描述

定义好iconfont.css文件的@font-face声明,修改好引入的url地址

在这里插入图片描述

打开App.vue文件 ,引入static下刚才修改的iconfont.css字体图标文件

在这里插入图片描述

完成上线的步骤后就可以全局使用字体图标了

在这里插入图片描述

            <view class="search">
                <input type="text" v-model="searchName" placeholder-style="color:#c8c8c8;z-index:0;" placeholder="搜索">
                <span class="iconfont icon-fenxiang"></span>
                <span class="iconfont icon-close"></span>
            </view>

在这里插入图片描述

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

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

相关文章

matplotlib绘图实现中文宋体的两种方法(亲测)

方法一&#xff1a;这种方法我没有测试。 第一步 找宋体字体 &#xff08;win11系统&#xff09; 2.matplotlib字体目录&#xff0c;如果不知道的话&#xff0c;可以通过以下代码查询&#xff1a; matplotlib.matplotlib_fname() 如果你是Anaconda3 安装的matplotlib&#x…

不同组合地下管线的地质雷达响应特征分析

不同组合地下管线的地质雷达响应特征分析 前言 以混凝土管线为例&#xff0c;建立水平相邻管线电性模型&#xff0c;管径为60cm&#xff0c;中心埋深为70cm&#xff0c;管线长度为150cm&#xff0c;分别建立管线圆心相距150cm的两根相邻双管线和三管线模型&#xff0c;进行二…

SQL血缘解析原理

根据sql解析获取到表到表, 字段到字段间的关系,即血缘关系。实际上这是从sql文本获取到数据流的过程。 大致步骤如下&#xff1a; 1.sql文本进行词法分析 2.sql语法分析获取到AST抽象语法树 3.访问AST抽象语法树根据语法结构推测出数据的流向,例如create as select from 这种结…

使用x64dbg手动脱UPX壳(UPX4.1.0)

本文选用的壳是4.1.0的UPX壳 将加壳的exe文件拖入x64dbg 打开符号&#xff0c;进入第一个sample.exe 进入后在第一个位置下断点&#xff0c;按下F9运行 继续按下F9 单步运行到此处&#xff0c;发现只有RSP变红&#xff0c;根据ESP定律&#xff0c;进行下面的操作 所谓定律就像…

【配置conda环境】新版pycharm导入新版anaconda环境

最近下载了新版pycharm和新版anaconda&#xff0c;并且在命令行创建了环境&#xff0c;想着在pycharm里面导入环境。结果现在的导入方式发生了变化。 之前是通过导入Python.exe进行的。 现在&#xff1a; 当我们点击进去之后&#xff0c;会发现找不到python.exe了。 具体什么…

设置基站IP及设置基站连接服务器

基站状态指示灯 基站正常连接上服务器&#xff0c;基站指示灯如下&#xff0c; 第一个灯是电源指示灯常亮&#xff1b; 第二个灯为运行指示灯&#xff0c;程序正常运行第二个灯一直闪烁&#xff1b; 第三个灯为为网络指示灯&#xff0c;网络连接正常会常亮&#xff0c;网络…

B树和B+树的介绍和对比,以及MySQL为何选择B+树

在计算机科学中&#xff0c;B树和B树是常用的数据结构&#xff0c;用于在大规模数据集上进行高效的插入、删除和查找操作。它们在数据库管理系统、文件系统等许多实际应用中发挥着重要作用。本文将深入介绍B树和B树的结构特点、实际应用方面以及它们的优缺点&#xff0c;并最后…

Vue安装并使用Vue-CLI构建SPA项目并实现路由

目录 前言 一、Vue CLI简介 1.什么是Vue CLI 2.Vue CLI的特点 二、SPA项目搭建 1.安装Vue CLI 2.使用脚手架vue-cli来构建项目 ​编辑 3.项目结构说明 4.什么是*.vue文件 三、基于SPA完成路由并嵌套路由 1.基于SPA完成路由 1. 1在src下的components 创建自定义组件…

今天面了个腾讯拿38K的人,让我见识到了测试的天花板

6年测试经验&#xff0c;技术应该是能达到资深测试的水准&#xff0c;不仅能熟练地开发业务&#xff0c;而且还能熟悉项目开发&#xff0c;测试&#xff0c;调试和发布的流程&#xff0c;还应该能全面掌握数据库等方面的技能&#xff0c;如果技能再高些的话&#xff0c;甚至熟悉…

【小余送书第一期】《数据要素安全流通》参与活动,即有机会中奖哦!!

目录 1、背景介绍 2、本书编撰背景 3、本书亮点 4、本书主要内容 5、活动须知 1、背景介绍 随着大数据、云计算、人工智能等新兴技术的迅猛发展&#xff0c;数据已经成为我国经济社会发展的五大生产要素之一&#xff0c;《网络安全法》《个人信息保护法》《数据安全法》的…

新品上市 | 纳米级分选磁珠重磅来袭~(含试用福利)

细胞疗法在近年医药研发中发展十分迅速&#xff0c;是一种全新的药物开发模式&#xff0c;在癌症、传染病和自身免疫等疾病的治疗方面显示出了巨大的潜力。今年6月30日&#xff0c;中国药监局&#xff08;NMPA&#xff09;批准了由南京驯鹿生物申报&#xff0c;驯鹿生物和信达生…

VBA 将TXT的多行文本文件进行处理,以ID为单位处理成 一行

VBA 将TXT的多行文本文件进行处理&#xff0c;以ID为单位处理成 一行 序言 由于需要将TXT文件与Excel文件进行对比&#xff0c;但两种文件格式差异比较大&#xff0c;于是通过VBA写了一下小工具&#xff0c;以便日后方便使用。 TXT文件如下 VBA代码如下 ********************…

六、如何让卡片一直对着摄像头

上期我们创建了卡片&#xff0c;那么如何让卡片一直面向浏览器。这个交互有一部分公司还是很需要的&#xff0c;今天我们就来讲讲&#xff0c;先看效果图 在animate.js里面增加卡片Mesh的LookAt&#xff0c;代码如下 import camera from "./camera"; import rendere…

codesys【虚轴】

1概述&#xff1a;codesys里有3个轴&#xff1a; 自由编码器&#xff0c;虚轴&#xff0c;实轴。 流程&#xff1a;【高速输入&#xff1a;采集AB脉冲】带》【自由编码器】带》【虚轴】带》【实轴】 1虚轴&#xff1a; 用法和实轴一样。 一般用于&#xff0c;一拖多。 2编…

索尼 toio™应用创意开发征文|检测工业平台震动

虽然索尼toio Q宝机器人主要是为儿童教育娱乐开发的&#xff0c;但我认为它在工业等领域也有一定应用潜力。例如&#xff0c;工业领域经常会有某些平面在实际作业中持续震动&#xff0c;导致零件过疲劳、平台失去稳定等问题。而这样的平台往往位于机器内部&#xff0c;从外部很…

asp.net core mvc Razor +dapper 增删改查,分页(保姆教程)

说明&#xff1a;本demo使用sqlserver数据库&#xff0c;dapper orm框架 完成一张学生信息表的增删改查&#xff0c;前端部分使用的是Razor视图&#xff0c; Linq分页 HtmlHelper。&#xff08;代码随便写的&#xff0c;具体可以自己优化&#xff09; //实现效果如下&#xff0…

Python爬虫教程——解析网页中的元素

前言&#xff1a; 嗨喽~大家好呀&#xff0c;这里是小曼呐 ~ 在我们理解了网页中标签是如何嵌套&#xff0c;以及网页的构成之后&#xff0c; 我们就是可以开始学习使用python中的第三方库BeautifulSoup筛选出一个网页中我们想要得到的数据。 接下来我们了解一下爬取网页信息…

Java 实现前端数据的导出操作

前端 <el-button class"export" type"primary" icon"el-icon-download" click"exportData()">导出</el-button>exportData() {//data 操作data 变成后端需要的格式let data {capacityVos: resultVo}this.$confirm("…

28 drf-Vue个人向总结-1

文章目录 前后端分离开发展示项目项补充知识开发问题浏览器解决跨域问题 drf 小tips设置资源root目录使用自定义的user表设置资源路径media数据库补充删除表中数据单页面与多页面模式过滤多层自关联后端提交的数据到底是什么jwt token登录设置普通的 token 原理使用流程解析 jw…

二十,镜面IBL--打印BRDF积分贴图

比起以往&#xff0c;这节应该是最轻松的了&#xff0c; 运行结果如下 代码如下&#xff1a; #include <osg/TextureCubeMap> #include <osg/TexGen> #include <osg/TexEnvCombine> #include <osgUtil/ReflectionMapGenerator> #include <osgDB/Re…