vue全局修改设置滚动条样式

vue全局修改设置滚动条样式

具体代码:

::-webkit-scrollbar{ /*滚动条整体样式*/width: 6px; /*高宽分别对应横竖滚动条的尺寸*/height: 1px;
}
::-webkit-scrollbar-thumb{ /*滚动条里面小方块*/border-radius: 5px;background: #cfcbcb;
}
::-webkit-scrollbar-track{ /*滚动条里面轨道*/border-radius: 6px;background: #ededed;
}

配置方法:

  1. 找到项目src文件下全局index.scss 活index.css目标文件,将上述代复制进目标文件里。
  2. 找到main.js文件引入上述全局css文件
// mian.js 
import "@/styles/index.scss"; // global css

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

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

相关文章

websocket的使用及建立连接

1. websocket 1.客户端与服务端建连接2.客户端向服务端发送消息3.服务端在接受消息后以“response-接受的消息内容“的形式返回给客户端4.当服务端收到第5条信息的时候,主动关闭与客户端的连接 客户端代码 ​private void clientWebSocket(String url) {OkHttpClie…

声压级越大,STIPA 越好,公共广播就越清晰吗?

在公共广播中,有些朋友经常问到是不是声压越大,广播清晰度就越高,下面我从搜集了一些专业技术资料,供大家参考。 一、声压级越大,STIPA 越好吗? 不完全是。最初,人们认为当声压级达到 60 dBA 以…

氢燃料电池汽车行业发展

文章目录 前言 市场分布 整车销售 发动机配套 氢气供应 发展动能 参考文献 前言 见《氢燃料电池技术综述》 见《燃料电池工作原理详解》 见《燃料电池发电系统详解》 见《燃料电池电动汽车详解》 市场分布 纵观全球的燃料电池汽车市场,截至2022年底&#xff…

2024最新 Jenkins + Docker实战教程(一) - Jenkins介绍及安装

😄 19年之后由于某些原因断更了三年,23年重新扬帆起航,推出更多优质博文,希望大家多多支持~ 🌷 古之立大事者,不惟有超世之才,亦必有坚忍不拔之志 🎐 个人CSND主页——Mi…

Android BACK键和HOME键应用差异详解

文章目录 1、应用层分析1.1 BACK键功能实现 1.2 HOME键功能实现 1.3 BACK键与HOME键的区别 2、系统层分析2.1 BACK键的处理2.2 HOME键的处理2.3 代码分析BACK键HOME键BACK键的系统代码分析HOME键的系统代码分析BACK键HOME键 3、优缺点分析3.1 BACK键3.2 HOME键 4、项目中的使用…

【ERNIE + PaddleOCR】 创建自己的论文字典,更好的写论文吧!

一、项目背景 在撰写论文的过程中,许多作者习惯先以中文完成初稿,随后再将其翻译为英文。然而,这种翻译过程往往伴随着一系列挑战。尤其是在词汇选择和语法结构上,很容易使用到一些在学术论文中不常用或不符合规范的表达。为了克服…

【学习笔记】Windows GDI绘图(七)图形路径GraphicsPath详解(下)

文章目录 前三篇回顾GraphicsPath方法Flatten压平(将曲线转成线段)GetBounds获取外接矩形GetLastPoint获取路径最后一个点IsOutlineVisibleIsVisiable是否在轮廓上或内部Reset重置Reverse逆转点的顺序Transform矩阵变换Wrap扭曲变换Widen将路径替换为指定画笔的填充区域 前三篇…

安卓手机APP开发__USB主机和配件概述

安卓手机APP开发__USB主机和配件概述 目录 概述 USB 配件模式 调试注意事项 选择合适的 USB 配件 API 支持 USB 主机模式 API 概览 清单和资源文件示例 概述 Android 通过 USB 配件和 USB 主机两种模式支持各种 USB 外围设备和 Android USB 配件(实现 Andr…

springboot学习记录--Maven setting配置

一、配置本地仓库 1 <!--自定义本地仓库路径--> Mirro&#xff1a;Maven 将从镜像仓库获取资源&#xff0c;不同的地理位置或具有更快的网络访问速度。 阿里云镜像&#xff1a; <mirror> <id>aliyunmaven</id> <mirrorOf>*</mirrorO…

TypeScript中的模块和命名空间:代码组织与封装

TypeScript中的模块和命名空间&#xff1a;代码组织与封装 引言 在TypeScript中&#xff0c;模块和命名空间是两种用于代码组织和封装的工具。模块用于将代码划分为独立的单元&#xff0c;而命名空间提供了一种将相关类型和值分组的方式。 基础知识 模块&#xff1a;通过文…

fastapi的简单实战,且用uvicorn将日志同时输出到控制台和日志文件中

简单描述 fastapi的简单实战&#xff0c;且用uvicorn将日志同时输出到控制台和日志文件中 main.py import signal import sys from contextlib import asynccontextmanagerfrom fastapi import FastAPI import uvicorn from fastapi.staticfiles import StaticFilesfrom set…

生成式AI导论2024-李宏毅

生成式AI导论2024-李宏毅 第0讲&#xff1a; 课程说明第1讲&#xff1a;生成式AI是什么第2講&#xff1a;今日的生成式人工智慧厲害在哪裡&#xff1f;從「工具」變為「工具人」 第0讲&#xff1a; 课程说明 生成式AI的入门课程 第1讲&#xff1a;生成式AI是什么 生成式人…

python调用阿里云通义千问(q-wen-max)API-创建智能体Agent

文章目录 Assistant API简介创建和使用Assistant API1、调用Assistant API夸克搜索回答问题2、Agent智能体构建Assistant API简介 百炼Assistant API能够让用户定制化构建一个assistant,这个assistant支持多种不同的指令(instruction)和描述(prompt),并且可以使用各类工…

AI预测福彩3D采取888=3策略+和值012路一缩定乾坤测试5月26日预测第2弹

昨天的8883大底成功命中&#xff0c;但是由于昨天杀了对子&#xff0c;结果昨天开了对子&#xff0c;导致最终与中奖号码擦肩而过。今天继续基于8883的大底&#xff0c;使用尽可能少的条件进行缩号&#xff0c;同时&#xff0c;今天将准备两套方案&#xff0c;一套是我自己的条…

队列——顺序存储

核心思路&#xff1a; 1、使用顺序存储的方式定义队列时&#xff0c;使用数组存储队列元素&#xff0c;然后声明两个int类型的指针——rear和front&#xff0c;分别指向队尾元素的下一个位置和队头元素的位置。 2、初始化队列时&#xff0c;队列的首尾指针都指向0 。 3、当队列…

2021 年 3 月青少年软编等考 C 语言二级真题解析

目录 T1. 与指定数字相同的数的个数思路分析 T2. 合法 C 标识符思路分析 T3. 计算鞍点思路分析 T4. 谁考了第 k 名思路分析 T5. 石头剪刀布思路分析 T1. 与指定数字相同的数的个数 输出一个整数序列中与指定数字相同的数的个数。 时间限制&#xff1a;1 s 内存限制&#xff1…

【CSS】计算属性 calc 函数

CSS 中的 calc() 函数是用于动态计算数值的函数。它可以在 属性的值中执行基本的数学运算&#xff0c;包括加法、减法、乘法和除法&#xff0c;以及使用 CSS 单位进行计算。 calc() 函数的语法如下&#xff1a; calc(expression) 其中 expression 是包含数学运算和 CSS 单位表…

英语学习笔记28——Where are they?

Where are they? 他们在哪里&#xff1f; 课文部分

【NumPy】关于numpy.median()函数,看这一篇文章就够了

&#x1f9d1; 博主简介&#xff1a;阿里巴巴嵌入式技术专家&#xff0c;深耕嵌入式人工智能领域&#xff0c;具备多年的嵌入式硬件产品研发管理经验。 &#x1f4d2; 博客介绍&#xff1a;分享嵌入式开发领域的相关知识、经验、思考和感悟&#xff0c;欢迎关注。提供嵌入式方向…

贝叶斯算法:机器学习中的“黄金法则”与性能提升之道

&#x1f440;传送门&#x1f440; &#x1f50d;机器学习概述&#x1f340;贝叶斯算法原理&#x1f680;贝叶斯算法的应用✨文本分类✨医疗系统 &#x1f496;贝叶斯算法优化✨贝叶斯算法优化的主要步骤✨贝叶斯算法优化的优点✨贝叶斯算法优化的局限性 &#x1f697;贝叶斯算…