scrollbar-width: none仅在Firefox生效，必须配合overflow-y:auto/scroll及明确高度才能隐藏滚动条并保留滚动；Chrome/Safari需用::-webkit-scrollbar{display:none}，IE/旧Edge用-ms-overflow-style:none。
scrollbar-width: none 只在 Firefox 中生效，且必须配合 overflow-y 才能真正隐藏滚动条并保留滚动——单独写它，什么都不会发生。
Firefox 里 scrollbar-width: none 不起作用？检查这三点
常见错误不是属性写错，而是上下文缺失：
-
scrollbar-width: none必须写在有滚动内容的容器上，不能只加在body或html上（对整页无效） - 容器必须有明确高度约束（
height或max-height），否则overflow-y不触发，伪滚动状态都不存在 - 必须同时声明
overflow-y: auto或overflow-y: scroll；只写scrollbar-width，内容会被裁剪但无法滚动
为什么 Chrome/Safari 里写了也没用？这不是 bug
scrollbar-width 是 Firefox 专属非标准属性，Chrome、Safari、新版 Edge（Blink 内核）完全忽略它。你看到滚动条还在，是预期行为。别试图用它“兼容所有浏览器”，它只管 Firefox 这一端。
要覆盖其他浏览器，得靠：
- WebKit/Blink：用
::-webkit-scrollbar { display: none; } - IE / 旧 Edge（EdgeHTML）：用
-ms-overflow-style: none;
三者缺一不可，且各自只在对应引擎中起效。
::-webkit-scrollbar { display: none; } 为什么有时还显示滚动条？
这个伪元素必须完整写，漏掉主选择器就失效：
- ❌ 错误：只写
::-webkit-scrollbar-track { display: none; }—— 滑块和主区域仍存在 - ✅ 正确：必须写
::-webkit-scrollbar { display: none; }，这是最简、最可靠写法 - ⚠️ 注意：该规则不能写在
style="..."内联样式里，只能放在块或外部 CSS 文件中
容易被忽略的是：所有方案都依赖 overflow-y 的实际计算结果。如果内容没溢出、容器没设高、或者父级 overflow: hidden 截断了渲染链，那任何 scrollbar 隐藏规则都不会被应用——先确保能滚，再谈藏不藏。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
