修改el-table默认滚动条样式

el-table原有滚动条样式对有些用户来说太窄,拖动起来不方便,因此做出如下修改。

修改前的样式图:

修改后的样式图:

样式代码:

<style lang="scss" scoped>
::v-deep ::-webkit-scrollbar {
  width: 6px;
  height: 10px;
  background-color: #ebeef5;
}
::v-deep ::-webkit-scrollbar-thumb {
  box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
  background-color: #ccc;
}
::v-deep ::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
  border-radius: 3px;
  background: rgba(255, 255, 255, 1);
}
</style>

我这块代码实现是在vue2版本项目中。

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

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

相关文章

CSS易漏知识

复杂选择器可以通过&#xff08;id的个数&#xff0c;class的个数&#xff0c;标签的个数&#xff09;的形式&#xff0c;计算权重。 如果我们需要将某个选择器的某条属性提升权重&#xff0c;可以在属性后面写!important&#xff1b;注意!importent要写在;前面 很多公司不允许…

C++:模版初阶

目录 1. 泛型编程 2.函数模版 2.1. 函数模版的用法 2.2. 函数模版的原理 2.3 函数模板的实例化 2.4 模版参数的匹配原则 3. 类模版 3.1 类模版的格式 3.2. 类模版的实例化 1. 泛型编程 如何实现整形、字符串&#xff0c;或者其他自定义类型的交换函数&#x…

028.爬虫专用浏览器-抓取#shadowRoot(closed)下的内容

一、什么是Shadow DOM Shadow DOM是一种在web开发中用于封装HTML标记、样式和行为的技术&#xff0c;以避免组件间的样式和脚本冲突。它允许开发者将网页的一部分隐藏在一个独立的作用域内&#xff0c;从而实现更加模块化和可维护的代码结构 二、js操作Shadow DOM // 获取宿…

命名空间std, using namespace std

命名空间std&#xff0c;using namespace std 在标准C以前&#xff0c;都是用#include<iostream.h>这样的写法的&#xff0c;因为要包含进来的头文件名就是iostream.h。标准C引入了名字空间的概念&#xff0c;并把iostream等标准库中的东东封装到了std名字空间中&#x…

React类组件详解

React类组件是通过创建class继承React.Component来创建的&#xff0c;是React中用于构建用户界面的重要部分。以下是对React类组件的详细解释&#xff1a; 一、定义与基本结构 类组件使用ES6的class语法定义&#xff0c;并继承自React.Component。它们具有更复杂的功能&#xf…

笔记整理—linux驱动开发部分(2)模块信息与编译

对于linux而言&#xff0c;.ko文件为驱动文件&#xff0c;在终端可以使用lsmod列出已经安装的模块&#xff0c;使用insmod xxx.ko安装所需要的模块&#xff0c;modinfo xxx.ko打印某个模块提供的信息&#xff0c;rmmod xxx卸载某个不需要的模块。 insmod与module_init宏。在源代…

智能台灯设计(一)原理图设计

1. 前言 作者最近突发奇想&#xff0c;想自己做一个小台灯&#xff0c;设想的功能有&#xff1a;带锂电池可充电、可以调节亮度&#xff0c;后续通过增加WIFI模块实现手机控制开关功能。目前先实现最简单的功能&#xff0c;有时间再一步步完善吧。 2. 原理图设计 充电芯片使用…

[LitCTF 2023]破损的图片(初级)的write up

开启靶场&#xff0c;下载附件&#xff0c;解压后得到文件&#xff1a; 破损的图片&#xff0c;那应该是文件头缺失 用010editor打开&#xff1a; 文件尾是AE 42 60 82&#xff0c;说明原图片是png格式&#xff0c;文件头前八个字节是3F&#xff0c;且对应8个"?"&am…

0softmax和背后的最大熵(极大似然法)

只要无穷阶矩都一样&#xff0c;那么两个分布一定一样。 整理思路&#xff1a;1、设定样本的概率模型与目标概率模型一致&#xff08;两个模型特性函数一致&#xff09;建立服从伯努利分布的变量&#xff08;此处需要理解样本空间及变量的关系&#xff09;对两个模型进行降维&a…

Could not retrieve mirrorlist http://mirrorlist.centos.org错误解决方法

文章目录 背景解决方法 背景 今天在一台新服务器上安装nginx&#xff0c;在这个过程中需要安装相关依赖&#xff0c;在使用yum install命令时&#xff0c;发生了以下报错内容&#xff1a; Could not retrieve mirrorlist http://mirrorlist.centos.org/?release7&archx8…

HarmonyOS 相对布局(RelativeContainer)

1. HarmonyOS 相对布局&#xff08;RelativeContainer&#xff09; 文档中心:https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/arkts-layout-development-relative-layout-V5   RelativeContainer为采用相对布局的容器&#xff0c;支持容器内部的子元素设…

ssh服务器相关实验

相关命令 下载软件 yum install openssh-server 查看公私钥 ll /etc/ssh/ 查看配置文件 rpm -qf /etc/ssh/sshd_config 修改ssh端口号&#xff08;改成2222&#xff09; vim /etc/ssh/sshd_config 拒绝root用户远程登录 进入配置文件所在文件夹 cd /etc/ssh/sshd_config.d/ 进…

ionic Capacitor 生成 Android 应用

官方文档 https://ionic.nodejs.cn/developing/android/ https://capacitorjs.com/docs/getting-started 1、创建新的 Capacitor 应用程序 空目录下面 npm init capacitor/app2、install Capacitor npm install npm start在这里插入图片描述 3、生成dist目录 npm run buil…

【ArcGIS Pro实操第5期】全局及局部空间插值:GPI、LPI、IDW等

ArcGIS Pro实操第5期&#xff1a;全局及局部空间插值 ArcGIS Pro-用于空间插值的丰富工具箱实操&#xff1a;空间插值方法1&#xff1a;Trend Surface Model for Interpolation-以降水数据为例方法2&#xff1a;Kernel Density Estimation Method-以单位面积鹿的目击数为例方法…

用接地气的例子趣谈 WWDC 24 全新的 Swift Testing 入门(一)

概述 从 WWDC 24 开始&#xff0c;苹果推出了全新的测试机制&#xff1a;Swift Testing。利用它我们可以大幅度简化之前“老态龙钟”的 XCTest 编码范式&#xff0c;并且使得单元测试更加灵动自由&#xff0c;更符合 Swift 语言的优雅品味。 在这里我们会和大家一起初涉并领略…

基于SSM美容院管理系统的设计

管理员账户功能包括&#xff1a;系统首页&#xff0c;个人中心&#xff0c;用户管理&#xff0c;套餐类型管理&#xff0c;美容预约管理&#xff0c;生日提醒管理&#xff0c;管理员管理&#xff0c;系统管理 员工账号功能包括&#xff1a;系统首页&#xff0c;个人中心&#…

普推知产:申请商标名称从4字改成3字下了初审!

近日7月的时候普推知产老杨帮客户申请的水果猕猴桃31类商标&#xff0c;初步审定公告下来了&#xff0c;基本没什么问题三个月公告结束后一个月内就可以拿到商标注册证&#xff0c;客户所在地全国有名猕猴桃之县&#xff0c;同质化竞争还得需要商标才可以。 刚开始了解到这位做…

Three.js遮罩多场景穿梭过渡

仓库 思路&#xff1a; 渲染一个遮罩 亮的区域为需要显示另一个场景的区域 在靠近门时完全渲染一个场景 在穿过门的同时切换场景关系 if (this.Doors.length) {// 材质变为黑色 除了“门”toggleRoughnessMaterial("black");// 设置RenderTarget保存结果renderer.se…

【Linux系统】为什么环境变量具有全局性?共享?写时拷贝优化?

环境变量表具有全局性的原因&#xff1a; 环境变量表之所以具有全局性的特征&#xff0c;主要是因为它们是在进程上下文中维护的&#xff0c;并且在大多数操作系统中&#xff0c;当一个进程创建另一个进程&#xff08;即父进程创建子进程&#xff09;时&#xff0c;子进程会继承…

网站建设前需要搞清楚哪些问题

网站建设前需要搞清楚的问题涉及多个方面&#xff0c;以下是一些关键问题的概述&#xff1a; 明确目标和目的 企业宣传与品牌塑造&#xff1a;网站是企业展示形象、传播品牌的重要窗口。通过精心设计的网站界面和内容布局&#xff0c;可以向潜在客户传递企业的价值观、文化理念…