bootstrap 5 默认不接管滚动条样式，需用原生 css 伪元素自定义；webkit 浏览器用 ::-webkit-scrollbar，firefox 用 scrollbar-width 和 scrollbar-color，且样式必须作用于实际可滚动元素。
Bootstrap 5 默认不接管滚动条样式
Bootstrap 5 完全移除了对 ::-webkit-scrollbar 的任何默认样式覆盖，也就是说——你看到的滚动条，就是浏览器原生的，和 Bootstrap 没关系。想改，得自己动手加 CSS，不能指望 bootstrap.min.css 里藏着什么隐藏开关。
常见错误现象：npm install bootstrap 后发现滚动条还是老样子，以为漏装了插件或没启用某项配置；其实压根没这功能。
- 所有自定义都必须通过原生 CSS 伪元素实现，和 Bootstrap 版本无关（v4/v5 都一样）
- 只在 WebKit 内核浏览器（Chrome、Edge、Safari）生效；Firefox 不支持
::-webkit-scrollbar，需另用scrollbar-width和scrollbar-color - 别试图在
data-bs-*属性或 Bootstrap 工具类里找滚动条控制项——不存在
怎么写兼容 Chrome/Edge/Safari 的自定义滚动条
核心是给容器（比如 .custom-scroll）加上 overflow-y: auto，再用伪元素定制其内部滚动条。注意：必须作用于有滚动行为的元素本身，不是全局 body 或 html（除非你真想改整个页面）。
典型结构：
.custom-scroll {
overflow-y: auto;
}
<p>.custom-scroll::-webkit-scrollbar {
width: 8px;
}</p><p>.custom-scroll::-webkit-scrollbar-track {
background: #f1f1f1;
}</p><p>.custom-scroll::-webkit-scrollbar-thumb {
background: #888;
border-radius: 4px;
}</p><p>.custom-scroll::-webkit-scrollbar-thumb:hover {
background: #555;
}</p>
-
::-webkit-scrollbar控制整体宽度，太窄（）可能被系统忽略 -
::-webkit-scrollbar-thumb至少要设background，否则不可见 - 不要给
::-webkit-scrollbar-track设border或padding，它不响应这些 - 如果容器用了
position: relative或transform，某些旧版 Chrome 下滚动条可能错位
Firefox 下怎么同步生效
Firefox 完全不认 ::-webkit-scrollbar，但支持两个专用属性：scrollbar-width 和 scrollbar-color，只能用于根元素或可滚动块级元素。
示例（接上一段）：
.custom-scroll {
scrollbar-width: thin; /* auto / thin / none */
scrollbar-color: #888 #f1f1f1; /* thumb track */
}
-
scrollbar-width: thin是唯一能缩小宽度的方式，但无法精确到像素 -
scrollbar-color只接受两个颜色值，顺序固定：先拇指色，后轨道色 - 这两个属性在 Chrome/Edge 中被忽略，所以可以和 WebKit 规则共存，无需媒体查询
- 不支持 hover 效果，也不支持圆角等样式——Firefox 目前就这能力
为什么在 Modal 或 Offcanvas 里滚动条样式失效
因为 Bootstrap 的 .modal 和 .offcanvas 默认设置了 overflow: hidden 在父容器上，而实际滚动内容在子元素（如 .modal-body）里。如果你只给 .modal 加样式，伪元素根本挂不上。
- 必须把自定义规则明确写到滚动内容容器上，例如：
.modal-body::-webkit-scrollbar - Modal 打开时会加
body的overflow: hidden，但这不影响内部滚动条样式定义 - 如果用了
max-height+overflow-y: auto组合，确保高度计算没被 padding/margin 干扰，否则可能不触发滚动 - 动态插入的内容（如 Ajax 加载进
.modal-body）不需要重写样式，CSS 伪类是实时匹配的
最常被忽略的一点：滚动条样式是「依附于可滚动元素」的，不是全局主题。写错选择器层级，或者选了没滚动行为的父容器，样式就等于没写。
