css设置滚动条样式

效果图:

javascript 复制代码
// 滚动条样式
div::-webkit-scrollbar {
    width: 4px;
}
/* 滚动条滑块(里面小方块) */
div::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
    opacity: 0.2;
    background-color: #4180EF;
}

/* 滚动条轨道 */
div::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
    border-radius: 0;
    background-color: #DEDFE0;
}
相关推荐
溪语流沙几秒前
【Web全栈进阶】Vue3起步:组件、模板语法、响应式数据
前端·javascript·vue.js·css3
程序员大阳1 小时前
副队长CSS教程(37)–transition 过渡
前端·css·transition·过渡
ZoeLandia1 小时前
TypeScript 01:类型注解与类型推断
前端·javascript·typescript
第六种自由2 小时前
[路飞]_Leetcode 22. 括号生成
javascript·算法·leetcode
JAVA老架构AI智能化2 小时前
多图叠加比对
前端·javascript·chrome
踏月了无痕2 小时前
01写一个简单的API服务
javascript
志尊宝2 小时前
Vue3 零基础每日笔记(081):富文本编辑器集成 wangEditor 5——封装
前端·javascript·vue.js·笔记·信息可视化·echarts
志尊宝3 小时前
Vue3 零基础每日笔记(080):Vue3 + ECharts 数据可视化——封装可复用图表组件
前端·javascript·vue.js·笔记·信息可视化·echarts
CappuccinoRose3 小时前
CSS 动效基础
前端·css·动画·animation·transition
百度一下吧3 小时前
CSS 伪类使用与实践:从入门到进阶
前端·css