直接写::-webkit-scrollbar没反应，是因为它只作用于真正触发滚动的容器，需满足固定/最大高度、overflow-y:auto、内容真实溢出三要素；.modal-body失效主因是overflow被覆盖、内容未溢出或选择器不精准；chrome需四条伪元素规则共存且挂同一容器，firefox则必须用scrollbar-width和scrollbar-color配对声明。
直接写 ::-webkit-scrollbar 没反应，不是 Bootstrap 锁死了样式，而是你没命中真正滚动的容器，或浏览器根本不支持那套写法。
为什么 .modal-body::-webkit-scrollbar 不生效
伪元素只对「计算后实际触发滚动行为」的元素起作用，不是写在哪就作用于哪。常见失效原因：
-
.modal-body的overflow-y被 JS 或其他 CSS 覆盖成了visible或hidden（务必用 DevTools 的 Computed 面板确认，别只看 Styles） - 内容高度没真超出容器——空
<div> 或 2 行文本不会触发滚动，塞满 10+ 行 <code><p></p>再测 - 写了
overflow-y: scroll：滚动条强制常驻，::-webkit-scrollbar-thumb:hover等交互逻辑可能不触发 - 选择器层级不够，比如
body .modal-body::-webkit-scrollbar权重低于 Bootstrap 默认规则，建议用.modal.show .modal-body::-webkit-scrollbar -
.modal-body::-webkit-scrollbar { width: 8px; }——width控垂直条粗细，小于 6px 在 macOS 下常被忽略 -
.modal-body::-webkit-scrollbar-track { background: #f8f9fa; }—— 别加border或box-shadow，旧版 Chrome 易错位 -
.modal-body::-webkit-scrollbar-thumb { background: #6c757d; border-radius: 4px; }——background是必填项，否则滑块透明不可见 -
.modal-body::-webkit-scrollbar-thumb:hover { background: #495057; }—— hover 效果仅在overflow-y: auto下稳定生效 .modal-body { scrollbar-width: thin; scrollbar-color: #6c757d #f8f9fa; }-
scrollbar-width只有thin、auto、none三个值，无法精确设像素宽度；macOS 下还受系统设置“仅当滚动时显示”干扰 -
scrollbar-color严格按顺序：第一个颜色是滑块色，第二个是轨道色；写成scrollbar-color: #6c757d;会整行失效 - 别指望圆角、hover、渐变——Firefox 目前（2026 年）完全不支持这些
Chrome/Edge/Safari 必须四条规则共存且挂同一容器
WebKit 内核只认 ::-webkit-scrollbar 系列，但必须成套出现、且全部写在滚动容器上（如 .modal-body），漏一条或分开放都无效：
Firefox 只认 scrollbar-width 和 scrollbar-color 且必须同选器声明
Firefox 完全不解析任何 ::-webkit- 伪元素，只支持两个属性，且必须写在同一 CSS 规则里，缺一不可：
真正卡住人的地方，往往不是写错某条规则，而是忘了确认三件事：目标容器是否真在滚动、CSS 是否真的应用到了那个容器上、当前浏览器到底支不支持你写的语法——尤其是 Firefox 里漏掉 scrollbar-width 或 scrollbar-color 中任意一个，整条声明就静默失效。
