技术栈

(css)滚动条样式

nyf_unknown2023-07-24 20:17

(css)滚动条样式


效果:


css 复制代码
/*滚动条整体样式*/
::-webkit-scrollbar {
  width: 2px;
  /*高宽分别对应横竖滚动条的尺寸*/
  height: 10px;
}
::-webkit-scrollbar-thumb {
  /*滚动条里面小方块*/
  border-radius: 10px;
  width: 2px;
  height: 60px;
  background: linear-gradient(0deg, #1f94b8 0%, #81d8b4 100%);
}
::-webkit-scrollbar-track {
  /*滚动条里面轨道*/
  border-radius: 10px;
  background: rgba(0, 0, 0, 0);
}
上一篇:C++-----list
下一篇:uni-app表单组件
相关推荐
xiaofeichaichai
1 小时前
前端安全 XSS 与 CSRF
前端·安全·xss
JS菌
1 小时前
Skills 动态加载系统:让 AI Agent 按需获取领域知识
前端·人工智能·后端
weedsfly
1 小时前
Sass 代码复用完全指南:从变量到模块化
前端
张拭心
1 小时前
Android 17 新特性:后台音频交互限制加强
android·前端
张拭心
1 小时前
Android 17 新特性:ProfilingManager 新触发器
android·前端
weixin_47138303
1 小时前
Taro-03-页面生命周期
前端·javascript·taro
张拭心
1 小时前
Android 17 新特性:MessageQueue 无锁实现
android·前端
Asize
1 小时前
数组数据结构底层:从灵活到陷阱
前端·javascript·算法
十九画生
1 小时前
Ajax 入门:用 XHR 理解前后端异步请求
前端·javascript·后端
热门推荐
01HTTP 与 HTTPS 的区别:从原理到实战详解022026 AI 编程工具终极实战指南:Cursor vs Claude Code vs Copilot,开发者该怎么选?03【AI】2026 年具身智能模型和世界模型总结042026年6月AI行业全景:从百模大战到Agent元年,这30天发生了什么?05AI科技热点日报 | 2026年6月1日06《置身钉内》原文-可播放阅读07GitHub 镜像站点08Claude Code、Codex、Cursor三分天下:2026年AI编程Agent生态全景剖析092026 年 AI 编程工具终极横评:Cursor vs Claude Code vs Copilot vs Windsurf10AI一周事件 · 2026-06-03 至 2026-06-09