最常见原因是bootstrap在模态框显示时通过padding-right补偿滚动条宽度但计算不准或被css覆盖，导致页面向右偏移；需检查body的padding/margin自定义样式、滚动容器设置及modal-open类是否生效。
模态框弹出时页面向右偏移（滚动条消失导致）
这是最常见原因：Bootstrap 默认会在 show 时给 加 modal-open 类，并临时禁用页面滚动——但禁用方式是通过设置 padding-right 补偿滚动条宽度，而这个宽度计算不准确或被覆盖，就会让内容“突然向右跳”。
- 检查是否自定义过
body的padding或margin，尤其在全局 CSS 里写了body { padding-right: 0 !important; }这类规则 - 确认是否用了非标准滚动容器（比如
overflow-y: scroll在某个父级上），导致 Bootstrap 拿不到真实滚动条宽度 - Bootstrap 5.3+ 默认启用
data-bs-scroll="true"可避免隐藏滚动条，但会失去背景锁定效果；如需锁定又不想抖，得手动修复补偿逻辑
modal-backdrop 和 body 滚动状态不同步
Backdrop 渲染延迟或 z-index 错位，会让浏览器误判需要重绘区域，触发 layout thrashing，表现为弹出瞬间页面“抽搐”。尤其在快速连续打开/关闭模态框时更明显。
- 避免在
$('#myModal').modal('show')后立刻操作 DOM 或触发布局读取（如offsetHeight） - 确保
.modal-backdrop没被其他样式设成opacity: 0或visibility: hidden，否则它不会参与滚动锁定计算 - 如果用了自定义 backdrop（比如用伪元素替代），务必同步控制
body的overflow和padding-right
使用了非官方 modal 初始化方式（如手写 show/hide 逻辑）
绕过 Bootstrap 的 JS 控制流，比如直接操作 classList 切换 show、fade，会导致滚动锁定逻辑完全失效，body 不加 modal-open，但 modal 自己强制 overflow: hidden，结果就是滚动条忽隐忽现、布局重排。
- 永远优先用
bootstrap.Modal.getInstance(el).show()（BS5）或$(el).modal('show')（BS4），别手动 toggle class - 如果必须手控，记得同步处理：
document.body.classList.add('modal-open')+ 设置document.body.style.paddingRight = '17px'（需动态测滚动条宽度） - 监听
hidden.bs.modal事件后，务必清除modal-open和还原padding-right，否则后续页面滚动异常
第三方库干扰（尤其是 scrollbar 替换类插件）
像 perfect-scrollbar、overlay-scrollbars 这类库会接管原生滚动行为，而 Bootstrap 的滚动条宽度检测只查原生 document.body.offsetWidth - document.documentElement.clientWidth，结果为 0，于是不补 padding，body 宽度突变。
- 在初始化 modal 前，先调用 scrollbar 插件的
destroy()方法释放原生滚动 - 或改用
data-bs-scroll="true"并配合 CSS 强制保留滚动条：body { overflow-y: scroll !important; } - 若无法卸载 scrollbar 插件，可在 modal 显示前手动计算其虚拟滚动条宽度并 patch 到 Bootstrap 的
getScrollbarWidth()方法（需 monkey patch）
实际修复时，90% 的抖动来自第一点：body 的 padding-right 被覆盖或没生效。别急着写 JS 修复，先打开 DevTools，弹出 modal 后看 body 元素上有没有 modal-open，再看 computed 样式里 padding-right 是不是真的变了——很多问题就卡在这一步没验证。
