若依ruoyi-vue element-ui 横向滚动条 动态横向滚动条

动态横向滚动条

因为每次横向滑动都要到底部,引入插件
https://github.com/mizuka-wu/el-table-horizontal-scroll
在这里插入图片描述

//动态横向滚动条移入样式
.el-table-horizontal-scrollbar :hover{
  //高度 变大10%
  transform: scaleY(1.5) translateY(-10%);
  //百分之八十亮度,加深
  filter: brightness(0.8);
  background-color: #C0C0C0;
}

//动态横向滚动条默认样式
.el-table-horizontal-scrollbar {
  transform: scaleY(1.5);
  background-color: #C0C0C0;
}

/* 默认底部横向滚动条样式 el-table自带的滚动条变大 */
.el-table__body-wrapper::-webkit-scrollbar {
  // 表格右侧滚动
  width: 15px !important;
  // 表格下方滚动
  height: 15px !important;
}

/**  设置默认底部横向滚动条样式,el-table自带的滚动条变大 */
.el-table__body-wrapper, .el-scrollbar__wrap {
  &::-webkit-scrollbar {
    width: 15px;
    height: 15px;
  }
}

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

HTML静态网页成品作业(HTML+CSS)——动漫海绵宝宝介绍网页(5个页面)

🎉不定期分享源码,关注不丢失哦 文章目录 一、作品介绍二、作品演示三、代码目录四、网站代码HTML部分代码 五、源码获取 一、作品介绍 🏷️本套采用HTMLCSS,未使用Javacsript代码,共有5个页面。 二、作品演示 三、代…

C++贪心算法(3)

整数区间 #include<bits/stdc.h> using namespace std; int main() {int n;cin>>n;int a[110][10]{0};for(int i0;i<n;i){cin>>a[i][1]>>a[i][2];}int cnt[110]{0};int mi99999;int mii-1;bool f[110]{false,false,false,false,false,false,false,…

mybatis-plus代码生成器【一看就会,复制即用】

环境 jdk 17、mysql 8、springboot 3.1.2 POM依赖 <dependency><groupId>com.baomidou</groupId><artifactId>mybatis-plus-core</artifactId><version>3.5.6</version></dependency> <!-- mybatis-plus代码生成依…

建筑施工突发事故应急处置vr安全培训平台

在不断发展的时代背景下&#xff0c;掌握必要的应急安全知识已成为我们生活中不可或缺的一部分。由央企携手我们华锐推出的3D线上应急宣教虚拟体验馆&#xff0c;标志着民众应急安全教育的全新里程碑&#xff0c;不仅突破了传统学习模式的局限&#xff0c;还让每个人都能在灵活…

深入了解时间处理:当前时间显示与格式化

新书上架~&#x1f447;全国包邮奥~ python实用小工具开发教程http://pythontoolsteach.com/3 欢迎关注我&#x1f446;&#xff0c;收藏下次不迷路┗|&#xff40;O′|┛ 嗷~~ 目录 一、引言 二、显示当前时间 1. 导入时间模块 2. 使用time模块获取当前时间 3. 格式化当前…

Python爬虫入门到进阶:解锁网络数据的钥匙

Python爬虫入门到进阶&#xff1a;解锁网络数据的钥匙 一、Python爬虫基础1.1 爬虫基本概念1.2 Python爬虫必备库1.3 第一个爬虫示例 二、实战爬虫实例2.1 爬取天气数据2.2 高级技巧&#xff1a;异步爬虫 三、反爬机制与应对策略3.1 常见反爬机制3.2 应对策略 四、性能优化与安…

oracle 12c GI卸载流程

集群节点停止服务 [crsctl stop crs -f grid运行deinstall [rootprimary1 bin]# su - grid [gridprimary1 ~]$ cd $ORACLE_HOME/deinstall [gridprimary1 deinstall]$ ls bootstrap_files.lst bootstrap.pl deinstall deinstall.pl deinstall.xml jlib readme.txt …

前端canvas实现图片涂鸦(Vue2、Vue3都支持)

先看一下效果图吧 代码组成&#xff1a;画笔大小、颜色、工具按钮都是组件&#xff0c;通俗易懂&#xff0c;可以按照自己的需求调整。 主要代码App.vue <template><div class"page"><div class"main"><div id"canvas_panel&qu…

CR渲染噪点严重怎么办?常见噪点来源+排查方法

使用Corona渲染器进行渲染时&#xff0c;画面出现噪点是常见现象&#xff0c;尤其是在渲染初期。轻微的高频噪点通常是正常的&#xff0c;但如果经过多次渲染或长时间渲染后噪点依然明显&#xff0c;就可能意味着渲染设置或场景本身存在问题。虽然我们可以利用降噪功能模糊噪点…

电脑记事软件哪款安全?好用且安全的桌面记事工具

在快节奏的现代生活中&#xff0c;我们每天都要用电脑处理大量的工作。电脑不仅提升了工作效率&#xff0c;还成为了我们记录重要事项和灵感的得力助手。比如&#xff0c;在策划项目时&#xff0c;我会直接在电脑上列出要点和步骤&#xff1b;在开会时&#xff0c;我也会用电脑…

浅谈桌面数控铣床在中职数控专业教学中的运用

目前大多数中职院校的数控铣床实训教学均采用工业数控机床设备&#xff0c;基本存在实训耗材费用高、教学成本高、实操危险性大、学生独立操作时间少,教学效率不高,教学质量也因设备数量原因较难提高等问题&#xff0c;桌面数控铣床具有成本低&#xff0c;体积小,操作灵活结构简…

Unity3D插件开发教程(二):制作批处理工具

Unity3D插件开发教程&#xff08;二&#xff09;&#xff1a;制作批处理工具 文章来源&#xff1a;Unity3D插件开发教程&#xff08;二&#xff09;&#xff1a;制作批处理工具 - 知乎 (zhihu.com) 声明&#xff1a; 题图来自于Gratisography | Free High Resolution Pictures…

STL源码刨析:序列式容器之list

目录 1.前言 2.list的节点定义和结构 3.list的迭代器定义和结构 4.list的定义和结构 5.list的内存管理 6.list的元素操作 前言 在刨析了vector容器的源码后&#xff0c;list容器相比与vector容器&#xff0c;其元素的插入和删除较快&#xff0c;不需要对原本容器中的元…

集合的交集、并集和差集运算

自学python如何成为大佬(目录):https://blog.csdn.net/weixin_67859959/article/details/139049996?spm1001.2014.3001.5501 集合最常用的操作就是进行交集、并集、差集和对称差集运算。进行交集运算时使用“&”符号&#xff0c;进行并集运算时使用“&#xff5c;”符号&…

SQL数据库多层嵌套 json转sql建表语句,SQL数据库里数组里对象数据怎么创建

1. uniapp sqlite 一个数组包含对象嵌套对象通过主外键方式插入数据库&#xff1a; // 假设有一个对象数组&#xff0c;对象中包含嵌套对象 const objectsArray [{parentObject: {id: 1,name: Parent 1,// 其他父对象属性},childObject: {id: 11,parentId: 1,name: Child 1 o…

vue中的$nextTick和过渡与动画

一.vue中的$nextTick 简述与用法&#xff1a;这是一个生命周期钩子 1.语法&#xff1a;this.$nextTick(回调函数) 2.作用&#xff1a;在下一次DOM更新结束后执行其指定的回调 3.什么时候用&#xff1a;当修改数据后&#xff0c;要基于更新后的新dom进行某些操作时&#xff0c;…

精酿啤酒:品质与口感在不同消费人群中的差异与共性

在啤酒市场中&#xff0c;不同消费人群对品质与口感的喜好存在一定的差异。然而&#xff0c;Fendi club啤酒凭借其卓着的品质和与众不同的口感&#xff0c;在不同消费人群中都展现出一定的共性。 从性别差异来看&#xff0c;男性消费者通常更注重啤酒的品质和口感&#xff0c;而…

Llama 3 模型家族构建安全可信赖企业级AI应用之使用 Llama Guard 保护大模型对话 (八)

LlaMA 3 系列博客 基于 LlaMA 3 LangGraph 在windows本地部署大模型 &#xff08;一&#xff09; 基于 LlaMA 3 LangGraph 在windows本地部署大模型 &#xff08;二&#xff09; 基于 LlaMA 3 LangGraph 在windows本地部署大模型 &#xff08;三&#xff09; 基于 LlaMA…

机器学习(七) ----------聚类(K-means)

目录 1 核心思想 2 K-means算法 2.1 算法概述 2.2 算法步骤 2.3 数学原理 2.4 ‘肘’方法确定K值 2.4.1 原理 2.4.2 步骤 2.4.3 代码实现 2.5 聚类评估方法 2.5.1 SC轮廓系数&#xff08;Silhouette Coefficient&#xff09; 计算方法 解读 注意事项 2.5.2 Cal…

Windows UWP ContentDialog去掉阴影(全透明)的实现

一、前言 在WIndows开发中&#xff0c;使用UWP&#xff08;Universal WIndows&#xff09;项目开发过程中&#xff0c;使用ContentDialog 的过程中&#xff0c;我们可能并不满足现有的样式&#xff0c;这时就需要自定义样式。笔者在自定义样式过程中&#xff0c;遇到了一个难题…