不能，绝大多数移动端浏览器已移除对 ::-webkit-scrollbar 的支持，包括 iOS Safari 和 Android Chrome v117+，因其在触屏场景下会干扰手指滑动体验。
移动端能用 ::-webkit-scrollbar 吗？
不能，绝大多数移动端浏览器（包括 iOS Safari、Android Chrome 从 v117+ 开始）已移除对 ::-webkit-scrollbar 的支持。你写一堆 ::-webkit-scrollbar-track 和 ::-webkit-scrollbar-thumb 规则，在 iPhone 上完全不会生效——连 display: none 都不认。
这不是兼容性“差”，而是被主动禁用：滚动条在触屏场景下本就不该干扰手指滑动体验，系统原生滚动条也无样式暴露接口。
所以别白费力气给 ::-webkit-scrollbar 加媒体查询或 UA 判断，它在真机上就是个摆设。
想隐藏移动端滚动条，用 overflow: hidden 还是 -webkit-overflow-scrolling: touch？
都不是好选择：
-
overflow: hidden 会直接禁掉滚动，内容不可见也不可操作
-
-webkit-overflow-scrolling: touch 是 iOS 旧版优化属性，仅影响滚动惯性行为，和滚动条样式无关，且已在 iOS 16+ 中废弃
真正可行的隐藏方式只有两个：
- 对容器设
overflow: scroll + scrollbar-width: none（Firefox 支持）
- 对容器设
overflow: scroll + ::-webkit-scrollbar { display: none }（仅对部分 Android Chrome 旧版本有效，iOS 全无效）
- 更通用的做法：用
padding-right 补上滚动条宽度（约 12px），再用 margin-right: -12px 抵消，配合 overflow: overlay（已废弃）或干脆接受默认滚动条
实际项目中，**隐藏不如接纳**——用户根本不在意滚动条长什么样，只在意能不能顺畅滑动。
如果非要自定义滚动行为，该用什么替代方案？
用 JavaScript 模拟滚动容器（例如 simplebar、overlay-scrollbars 或手写 scrollTop 控制），但要注意：
- 必须监听
touchstart/touchmove，不能只靠 mousewheel
- 要手动处理 momentum 惯性（iOS WebKit 不触发
scroll 事件直到结束，得用 requestAnimationFrame + 速度衰减模拟）
- 会破坏原生滚动的性能优势，尤其在长列表里容易掉帧
-
position: fixed 子元素在自定义滚动内可能错位，需额外 transform: translateZ(0) 强制图层提升
简单页面可以试试 overlay-scrollbars，它会自动降级：在支持 ::-webkit-scrollbar 的桌面端用伪元素，在移动端 fallback 到轻量 JS 控制。
overflow: hidden 会直接禁掉滚动，内容不可见也不可操作-webkit-overflow-scrolling: touch 是 iOS 旧版优化属性，仅影响滚动惯性行为，和滚动条样式无关，且已在 iOS 16+ 中废弃overflow: scroll + scrollbar-width: none（Firefox 支持）overflow: scroll + ::-webkit-scrollbar { display: none }（仅对部分 Android Chrome 旧版本有效，iOS 全无效）padding-right 补上滚动条宽度（约 12px），再用 margin-right: -12px 抵消，配合 overflow: overlay（已废弃）或干脆接受默认滚动条simplebar、overlay-scrollbars 或手写 scrollTop 控制），但要注意：
- 必须监听
touchstart/touchmove，不能只靠mousewheel - 要手动处理 momentum 惯性（iOS WebKit 不触发
scroll事件直到结束，得用requestAnimationFrame+ 速度衰减模拟） - 会破坏原生滚动的性能优势，尤其在长列表里容易掉帧
-
position: fixed子元素在自定义滚动内可能错位，需额外transform: translateZ(0)强制图层提升
overlay-scrollbars，它会自动降级：在支持 ::-webkit-scrollbar 的桌面端用伪元素，在移动端 fallback 到轻量 JS 控制。
不过多数情况下，让滚动条保持原样是最稳妥的选择——它不抢焦点、不卡顿、不增加 bundle 体积。
为什么开发者总想改滚动条？ 因为看到 PC 端能调，就默认“应该也能”。但移动端的交互模型完全不同：没有 hover、没有精确指针、滚动本身就是核心手势。所谓“美化”，往往只是把一个系统级无障碍组件，替换成一个更难用、更慢、更不可靠的自制版本。
真正值得花时间的，是确保容器有明确的 height 或 max-height、内容不意外撑开、滚动区域边界清晰——这些比滚动条颜色重要得多。
