禁用滚动条需分浏览器处理：Chrome/Safari/Edge用三件套::-webkit-scrollbar样式；Firefox用scrollbar-width: none作用于可滚动容器；iOS Safari需overflow-y: scroll配合scrollbar-width: none并真机测试。
直接对滚动容器设 overflow: hidden 会出问题
这招看似最快，但实际禁用了所有滚动行为：鼠标滚轮、触摸拖拽、键盘方向键全失效，内容被硬裁切。常见现象是抽屉里文字只显示前半截，或 Vue/React 动态渲染后内容“卡住不动”。overflow: hidden 不是隐藏滚动条，是砍掉滚动能力。
::-webkit-scrollbar 在 Chrome/Safari/Edge 上必须写全三件套
只写 .box::-webkit-scrollbar { width: 0; } 在 macOS Chrome 或新版 Edge 上经常无效。浏览器需要明确知道轨道和滑块也该消失，否则会 fallback 到默认样式。
.box::-webkit-scrollbar { width: 0; height: 0; }.box::-webkit-scrollbar-track { background: transparent; }.box::-webkit-scrollbar-thumb { background: transparent; border-radius: 0; }
注意：display: none 在 ::-webkit-scrollbar 里不合法，会触发 CSS 解析警告；opacity: 0 或 visibility: hidden 也不起作用。
Firefox 必须用 scrollbar-width: none，且不能写在 html 或 body 上
这个属性只对**实际可滚动的容器元素**生效，写在 html 标签上 Firefox 直接忽略。如果父级有 overflow: hidden，子容器即使设了 scrollbar-width: none 也会被截断，无法滚动。
立即学习“前端免费学习笔记（深入）”；
- 正确写法：
<div class="scroll-container">...</div>，然后对.scroll-container设scrollbar-width: none - 兼容性兜底可加：
scrollbar-color: transparent transparent - 别指望
scrollbar-width: thin在局部容器里生效——它只对根滚动有意义
iOS Safari 是最棘手的一环
iOS 15+ 要求容器必须显式设 overflow-y: scroll（不是 auto），::-webkit-scrollbar 才可能触发；但即便如此，伪元素在部分机型上仍被无视。唯一稳定路径是：scrollbar-width: none + 强制 overflow-y: scroll + 真机测试。
- 动态加载内容时，先设
height: 0; overflow: hidden，等 DOM 渲染完成再测高并过渡到max-height+overflow-y: scroll - 避免用
transform: translateY()模拟滚动——它绕过原生滚动机制，scrollIntoView和辅助功能全失效 - 微信内嵌 WebView 行为更接近 iOS Safari，不能只靠开发工具模拟
