CSS如何改变滚动条的颜色样式粗细?

默认滚动条很丑怎么办?如何改版滚动条的粗细,颜色,让它更美观?CSS如何改变滚动条的粗细?

干货来了

html 复制代码
/* Webkit内核浏览器的滚动条样式 */
::-webkit-scrollbar {
  width: 4px; /* 设置滚动条的宽度 */
}

::-webkit-scrollbar-thumb {
  background-color: #0A2148; /* 设置滚动条的颜色 */
}

/* Firefox浏览器的滚动条样式 */
::-moz-scrollbar {
  width: 4px; /* 设置滚动条的宽度 */
}

::-moz-scrollbar-thumb {
  background-color: #0A2148; /* 设置滚动条的颜色 */
}

效果图

🧨🧨🧨 完结,撒花~ ,记得收藏 ~

相关推荐
不务正业的前端学徒4 小时前
手写简单的call bind apply
前端
jump_jump4 小时前
Ripple:一个现代的响应式 UI 框架
前端·javascript·前端框架
用户904706683574 小时前
Nuxt css 如何写?
前端
神秘的猪头4 小时前
🎨 CSS 这种“烂大街”的技术,怎么在 React 和 Vue 里玩出花来?—— 模块化 CSS 深度避坑指南
css·vue.js·react.js
夏天想4 小时前
element-plus的输入数字组件el-input-number 显示了 加减按钮(+ -) 和 小三角箭头(上下箭头),怎么去掉+,-或者箭头
前端·javascript·vue.js
0思必得05 小时前
[Web自动化] Selenium基础介绍
前端·python·selenium·自动化·web自动化
Filotimo_5 小时前
前端.d.ts文件作用
前端
进击的野人5 小时前
Vue 3 响应式数据解构:toRef 与 toRefs 的深度解析
前端·vue.js·前端框架
ohyeah5 小时前
CSS 作用域隔离实战:React、Vue 与 Styled Components 的三种范式
前端
二哈喇子!5 小时前
前端HTML、CSS、JS、VUE 汇总
开发语言·前端