最轻量解法是加 data-bs-backdrop="static"，它让bootstrap跳过滚动条补偿流程，不加modal-open类、不写padding-right、不设overflow:hidden，只禁用点击遮罩关闭，esc键仍可用。
页面跳动不是模态框“有问题”，而是 Bootstrap 主动给 body 加了 padding-right 补偿滚动条消失，但 position: fixed 元素没同步右移——视觉上就是整页向左一抽。
为什么加 padding-right 反而更抖？
Bootstrap 5+ 动态计算滚动条宽度（比如 17px），通过内联样式写到 body 上：style="padding-right: 17px"。这个值优先级高于任何 CSS 规则，所以：
-
body { padding-right: 0 !important }不但无效，还会干扰后续恢复逻辑 - 导航栏、侧边栏、全屏背景图等
fixed元素完全不受影响，原地不动 - 流式内容被向右推，fixed 元素没动 → 错位感 = “抖”
- 若用了
scrollbar-gutter: stable both或overlay-scrollbars，计算结果可能为0，补偿失效或反向错位
最轻量解法：加 data-bs-backdrop="static"
它让 Bootstrap 跳过整个滚动条补偿流程——不加 modal-open 类、不写 padding-right、不设 overflow: hidden，只禁用点击遮罩关闭，ESC 键仍可用：
<div class="modal" data-bs-backdrop="static"> <ul> <li>适用于权限提示、表单确认、操作反馈等“不需要点背景关”的场景</li> <li>不破坏现有 CSS，不干扰下拉菜单、Tooltip 等其他组件</li> <li>删掉这个属性即可恢复点击关闭，无残留副作用</li> <li>macOS Safari、旧版 Edge 等兼容性无忧，不用 fallback</li> </ul> <h3>必须支持点击关闭？那就用 <code>.is-fixed</code> 类</h3> <p>这是 Bootstrap 5 内置的补偿钩子，专为 <code>fixed</code> 元素设计。它本身无样式，只告诉 Bootstrap JS：“这个元素要跟着 <code>body</code> 一起补 <code>padding-right</code>”：</p> <pre class="brush:php;toolbar:false;"><nav class="navbar fixed-top is-fixed"></nav><br><div class="hero-bg is-fixed"></div>
- 所有需要对齐的
fixed元素都得显式加这个类，漏一个就抖一个 - 不加的话，手动监听
show.bs.modal/hidden.bs.modal同步padding-right，极易漏事件或多层 modal 下失效 - 它只对
fixed-top、fixed-bottom、sticky-top和带.is-fixed的元素生效
别碰 scrollbar-gutter，除非你真测过兼容性
scrollbar-gutter: stable both 是浏览器原生占位方案，对 fixed 元素友好，但它不能单独生效：
- 必须配合禁用 Bootstrap 的 JS 补偿：
Bootstrap.Modal.Default.scrollbarWidth = 0 - 必须清空内联
padding-right：body.modal-open { padding-right: 0 !important } - iOS Safari 17.4 之前、旧版 Edge 不支持，得用
CSS.supports('scrollbar-gutter', 'stable')检测并 fallback - 真正难的不是写这几行，而是排查有没有第三方库（比如
perfect-scrollbar）悄悄改了body的overflow或内联padding-right
最容易被忽略的是：抖动往往不是没补偿，而是补偿被覆盖、算错，或 fixed 元素根本没参与补偿。加 .is-fixed 或换 data-bs-backdrop="static" 是唯二真正可控的路径，其他都是修修补补。
