Modal打开时页面“向左一缩”是Bootstrap 5主动添加的滚动条补偿逻辑：body加modal-open类并注入padding-right，但fixed元素未同步补偿；解决方案是为fixed元素添加.is-fixed类，或通过data-bs-backdrop="static"禁用补偿。
为什么 Modal 打开时页面会“向左一缩”
这不是 bug，是 bootstrap 5 主动加的滚动条补偿逻辑：模态框弹出时，body 被加上 modal-open 类，并注入 padding-right: 17px（值因浏览器滚动条宽度浮动），用来填补禁用滚动条后“消失”的右侧空间，防止内容横向抖动。但这个 padding-right 只作用于 body，而你的 position: fixed 导航栏、全屏背景图等元素没跟着右移补偿，视觉上就表现为整个固定层“被挤向左”——其实是它们没动，是其他内容往左回缩了。
fixed 元素右移/错位？加 .is-fixed 就行
Bootstrap 5 提供了标准解法：所有自定义 position: fixed 的元素，必须显式添加 .is-fixed 类。这个类本身无样式，是纯语义钩子，Bootstrap 内部会监听 modal-open 状态，自动为带 .is-fixed 的元素同步添加/移除 padding-right，保持对齐。
<nav class="navbar fixed-top bg-dark is-fixed"><div class="hero-bg is-fixed" style="background-image: url(...) ">- 不加
.is-fixed→ 模态框一开，导航栏就“跳”；加了 → 补偿自动对齐，毫无感知
不想用 padding 补偿？禁用它更直接
如果你的页面布局本身不依赖滚动条宽度（比如始终有横向留白、或已用 overflow-y: overlay 等现代方案），可以直接关掉 Bootstrap 的补偿行为：
- 在模态框根元素上加
data-bs-backdrop="static"：既禁用点击遮罩关闭，也跳过padding-right注入逻辑 - 或全局禁用：在 JS 初始化前覆盖
Bootstrap.Modal.Default.backdrop = 'static'（需确保不影响业务交互） - 注意：
data-bs-backdrop="static"不影响键盘 ESC 关闭，只停用遮罩点击关闭和滚动条补偿
滚动条不置顶、关闭后残留滚动位置？别靠 CSS 硬压
Modal 打开时默认不会重置 scrollTop，尤其从列表页某处点击“编辑”触发时，模态框内容顶部常卡在中间，体验割裂。这不是样式问题，得用事件钩子干预：
- 监听
shown.bs.modal事件，在里面调$('#myModal').scrollTop(0)或document.querySelector('#myModal .modal-body').scrollTop = 0 - 如果 Modal 内容是动态加载的，把
scrollTop = 0放在数据渲染完成后的回调里，否则可能无效 - 避免写
body { scroll-behavior: smooth }后又手动scrollTop，两者可能冲突导致卡顿
.is-fixed 是关键钥匙，不是可选项。漏掉它，再怎么 patch padding 或 hack overflow 都是治标。 
