element-ui中怎样使用iconfont的图标

news2024/9/20 7:59:28

1 登录

https://www.iconfont.cn/

2 搜索合适的图

在这里插入图片描述
在这里插入图片描述这里可以找到这个图所在的图库。这样就可以一次查找到对应的所有同款图标

3 选择同款加入购物车

在这里插入图片描述

4 将购物车的icon加入项目,注意是新建项目,除非你是确定需要前面已经加过的icon

在这里插入图片描述在这里插入图片描述

5 下载icon

在这里插入图片描述选择font-class 点击下载。其他方式还没用过…

6 导入vscode的vue项目

在这里插入图片描述在这里插入图片描述
我是简单粗暴都copy过去了,只copy css文件似乎有点问题

在这里插入图片描述copy文件 加 配置main.js 配置引入部分就结束了

7 使用

在这里插入图片描述此处是配合elment-ui使用,其他方式应该都是类似的

谢谢浏览,欢迎指正!

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

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

相关文章

SpringBoot的启动流程

一、SpringBoot是什么? springboot是依赖于spring的,比起spring,除了拥有spring的全部功能以外,springboot无需繁琐的xml配置,这取决于它自身强大的自动装配功能;并且自身已嵌入Tomcat、Jetty等web容器&am…

课程设计:C++实现哈夫曼编码

功能实现: //1:先计算每个字符的权重//2:构建哈夫曼树//3:得出每个字符的哈夫曼编码。//4:根据哈夫曼编码转化为字符 代码实现: // 哈夫曼编码.cpp : 此文件包含 "main" 函数。程序执行将在此处开始并结束。 //1:先计…

vue动态配置路由

文章目录 前言定义项目页面格式一、vite 配置动态路由新建 /router/utils.ts引入 /router/utils.ts 二、webpack 配置动态路由总结如有启发,可点赞收藏哟~ 前言 项目中动态配置路由可以减少路由配置时间,并可减少配置路由出现的一些奇奇怪怪的问题 路由…

如何将文字、图片、视频、链接等内容生成一个二维码?

通过二维彩虹的【H5编辑】功能,就可以将文字、图片、视频、文件、链接等多种格式的内容编辑在一个页面,然后生成一个自定义的二维码——H5编辑二维码。扫描后,即可查看二维码中的详细图文视频等内容了。这个功能大受欢迎! 这个H5…

深度学习之基于CT影像图像分割检测系统

欢迎大家点赞、收藏、关注、评论啦 ,由于篇幅有限,只展示了部分核心代码。 文章目录 一项目简介 二、功能三、系统四. 总结 一项目简介 基于CT影像的图像分割检测系统可以被设计成能够自动地检测出CT图像中的病变部位或解剖结构,以协助医生进…

庖丁解牛:NIO核心概念与机制详解 05 _ 文件锁定

文章目录 Pre概述锁定文件 (lock)Code文件锁定和可移植性 Pre 庖丁解牛:NIO核心概念与机制详解 01 庖丁解牛:NIO核心概念与机制详解 02 _ 缓冲区的细节实现 庖丁解牛:NIO核心概念与机制详解 03 _ 缓冲区分配、包装和…

calibre更新 环境变量设置

我这里是从别的地方copy过来的calibre,所以不用安装。 如果需要安装请参考: Caibre2022.3_17版本安装及遇到问题 - 梅希的日志 - EETOP 创芯网论坛 (原名:电子顶级开发网) -将copy过来的calibre放在原来calibre的位置。 打开工作路径下的.b…

【Vue】Vue3 超简单拖拽条动态修改容器宽度

demo 代码 const leftBoxWidth ref(200); // 默认宽度 const leftResize (e: MouseEvent) > {const startX e.clientX;const startWidth leftBoxWidth.value;const mouseMove (documentE: MouseEvent) > {// 80 是左侧菜单宽度leftBoxWidth.value startWidth docu…

不懂找伦敦银趋势?3个方法搞定

趋势是我们的朋友,但是这个朋友却很喜欢跟我们开玩笑,如果我们不留意,根本发觉不了它的存在。怎么找到趋势本体并且和它做个好朋友呢?下面我们就来介绍三个方法。 数波段的高点和低点。我们以当前的市场波动价格为轴,向…

快手运营的必备的10个工具

一、引言 快手作为短视频领域的佼佼者,为众多创作者提供了广阔的舞台。要想在快手运营中取得成功,掌握一些必备的工具是必不可少的。本文将为您介绍快手运营的10个必备工具,帮助您提高工作效率,优化内容创作。 二、工具推荐 1. …

现货白银MACD实战分析例子

MACD这个技术指标的全称是平滑异同移动平均线,主要表示经过平滑处理后均线的差异程度,一般用来研判现货白银价格变化的方向、强度和趋势。MT4中的MACD指标,主要是由信号线、(上升/下跌)动能柱、0轴这三部分组成。 MACD…

键盘映射笔记

dumpkeys命令用于显示当前系统中定义的键盘映射表。它可以帮助用户查看和理解系统中的键盘布局和键盘映射规则。 当用户执行dumpkeys命令时,它会读取系统中的键盘映射表文件(通常是/etc/keymaps或/etc/console/boottime.kmap.gz),…

chatglm-6B模型下载

从huggingface上面下载chatglm-6B模型是比较简捷的方式,下面记录一下下载安装过程。 huggingface的官方文档如下: https://huggingface.co/docs/huggingface_hub/v0.14.0.rc1/guides/download 1.配置conda环境 服务器上使用的是miniconda,…

如何在公网环境下使用笔记本的Potplayer访问本地群晖webdav中的影视资源

文章目录 如何在公网环境下使用笔记本的Potplayer访问本地群晖webdav中的影视资源**那么问题来了,potplayer只能局域网内访问资源,那我不在家中怎么看本地电影?** 本教程解决的问题是:按照本教程方法操作后,达到的效果…

什么是域欺骗?域欺骗的主要类型有哪些?

域欺骗是指网络犯罪分子假冒网站名称或电子邮件域来欺骗用户。域欺骗的目的是将恶意电子邮件或网络钓鱼网站伪装成合法电子邮件或网站,诱使用户与之交互。域欺骗就像骗子一样,向人们展示伪造的凭据以获得信任,然后再利用其获得好处。 域欺骗…

【PCB学习】几种接地符号

声明 该图并非原创,原文出处不可考,因此在这里附加说明。 示意图

在vue-cli中快速使用webpack-bundle-analyzer

webpack-bundle-analyzer 是一个可视化资源分析工具,可以直观地分析打包出的文件有哪些,及它们的大小、占比情况、各文件 Gzip压缩后的大小、模块包含关系、依赖项等。 从vue-cli官方的更新记录可以看到,从vue-cli3开始集成report命令 当前环…

IIC总线逻辑

一、 我们习以为常的IIC通常是什么样子? 在我们研发/应用工程师眼中,IIC的形象通常是如图这样的吧?(你们说是不是?) 是的,对于理想的硬件调程序,这个层…

利用JDBC及Servlet实现对信息录入注册功能的实现

利用JDBC及Servlet实现对登录注册功能的实现; 1.题目要求: 1、新建一个数据库名为(个人姓名拼音),表(学生所在城市),字段(sid:学号,sname&#x…

如何通过cpolar内网穿透工具实现远程访问本地postgreSQL

文章目录 前言1. 安装postgreSQL2. 本地连接postgreSQL3. Windows 安装 cpolar4. 配置postgreSQL公网地址5. 公网postgreSQL访问6. 固定连接公网地址7. postgreSQL固定地址连接测试 前言 PostgreSQL是一个功能非常强大的关系型数据库管理系统(RDBMS),下…