elementui loading自定义图标和字体样式

  • 需求:页面是用了很多个loading,需要其中有一个字体大些(具体到图标也一样的方法,换下类名就行)

  • 遇见的问题:改不好的话会影响其他的loading样式(一起改变了)

  • 效果展示

    • 改之前
      在这里插入图片描述
    • 改之后
      请添加图片描述
  • 关键知识点:element的loading自带的element-loading-custom-class="boxStyle"属性的使用(Loading 的自定义类名)

  • 代码

    <div class="box"v-loading="boxLoading":element-loading-text="正在删除,请勿关闭..."element-loading-spinner="el-icon-loading"element-loading-background="rgba(255, 255, 255, 1)"element-loading-custom-class="boxStyle"></div>//css
    <style lang="stylus" scoped>
    >>>.boxStylefont-size 40px .el-loading-spinner .el-loading-textfont-size: 24px;margin-top 10px
    </style>
    
  • 自定义类名成功加载到标签上的效果,是加在mask后面
    在这里插入图片描述

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

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

相关文章

C++完成Query执行sql语句的接口封装和测试

1、在LXMysql.h 创建Query执行函数 //封装 执行sql语句 if sqllen 0 strlen获取字符长度bool Query(const char*sql,unsigned long sqllen0); 2、在LXMysql.cpp编写函数 bool LXMysql::Query(const char* sql, unsigned long sqllen){if (!mysql)//如果mysql没有初始化好{c…

知识图谱与云计算

内容来自B站视频 复旦 肖仰华 老师的讲座&#xff0c;记在这里&#xff0c;不然一会就忘了。 https://www.bilibili.com/video/BV1HG4y1h7zK/?p5&spm_id_frompageDriver 智能的发展是由感知到认知&#xff0c;当下需要发展机器的认知能力。 实现认知智能需要人工智能的很…

01第一个Mybatis程序+引入Junit+引入日志文件logback

Mybatis MyBatis本质上就是对JDBC的封装&#xff0c;通过MyBatis完成CRUD。而对于JDBC&#xff0c;SQL语句写死在Java程序中&#xff0c;不灵活。改SQL的话就要改Java代码。违背开闭原则OCP。对于事务机制&#xff0c;MyBatis支持 或managed模式&#xff0c;JDBC模式中MyBatis…

2023-我的CSDN创作之旅

1.博客内容与数量 2023年共发表博客59篇&#xff0c;内容主要集中在GIS&#xff0c;空间分析等领域 主要内容有&#xff1a; networkx学习 Geospatial Data Science Geocomputation ESDA in PySal SHAP Spatial Data Analysis BikeDNA 以下是对这几个章节主要内容的简…

你的网站或许不需要前端构建(二)

前一阵&#xff0c;有朋友问我&#xff0c;能否在不进行前端编译构建的情况下&#xff0c;用现代语法开发网站界面。 于是&#xff0c;就有了这篇文章中提到的方案。 写在前面 这篇文章&#xff0c;依旧不想讨论构建或不构建&#xff0c;哪一种方案对开发更友好&#xff0c;…

改善 GitHub Pages 阅读体验:Quick Docs

一个不到 10MB 的小工具&#xff0c;来提供本地、快速的文档访问&#xff0c;来改善开发过程中&#xff0c;阅读在线文档体验糟糕的问题。 以及&#xff0c;介绍如何快速制作一个利于分发使用的&#xff0c;离线文档工具包。 写在前面 即使现在 AI 辅助编码和 Chat Bot 类的…

【linux】线程同步+基于BlockingQueue的生产者消费者模型

线程同步基于BlockingQueue的生产者消费者模型 1.线程同步2.生产者消费者模型3.基于BlockingQueue的生产者消费者模型 喜欢的点赞&#xff0c;收藏&#xff0c;关注一下把&#xff01; 1.线程同步 在线程互斥写了一份抢票的代码&#xff0c;我们发现虽然加锁解决了抢到负数票的…

大数据StarRocks(三) StarRocks数据表设计

1. 列式存储 1.1 列式存储方式有以下几个优点&#xff1a; 1.快速的数据查询 由于数据是按照列进行存储的&#xff0c;所以查询某个列时只需要读取该列所在的块&#xff0c;而不是整行数据&#xff0c;从而大大提高了查询效率。 2.压缩效率高 由于列式存储的数据块中只有一…

Linux | 分布式版本控制工具Git【版本管理 + 远程仓库克隆】

文章目录 一、前言二、有关git的相关历史介绍三、Git版本管理1、感性理解 —— 大学生实验报告2、程序员与产品经理3、张三的CEO之路 —— 版本管理工具的诞生 四、如何在Linux上使用Git1、创建仓库2、将仓库克隆到本地3、git三板斧① git add② git commit③ git push 4、有关…

时代新威受邀出席2023年ISC2亚太安全峰会

2023年ISC2亚太安全峰会&#xff08;Secure Asia Pacific&#xff09;近日在新加坡滨海湾金沙会议中心成功举办。 该活动由认证网络安全专业网络的全球领导者ISC2组织&#xff0c;旨在解决亚太地区和全球面临的紧迫网络安全挑战。会议为期两天&#xff0c;于2023年12月6日至7日…

Clion STM32 开发环境配置教程

Clion STM32 开发环境配置教程 STM32 CubeMX&#xff08;6.5&#xff09; 下载固件库 若固件库还未下载&#xff0c;可在启动界面点击&#xff0c;INSTALL/REMOVE下载所需要的固件库 选中对应固件库&#xff0c;点击Install即可 Clion&#xff08;2023.3.1&#xff09; 略 …

4.快速实现增删改查,模糊查询功能

打开springboot项目&#xff0c;在com.example下建包common,在common下新建Result.java 4.1封装统一的返回数据结构 1.在Result.java中编写如下代码&#xff1a; private static final String *SUCCESS*"0"; private static final String *ERROR*"-1"; p…