Modal弹出后背景出现横向滚动条，根本原因是Bootstrap添加modal-open类时自动注入padding-right（如17px）补偿滚动条消失，导致body总宽度增大；data-bs-backdrop="static"可彻底跳过该逻辑，避免错位与滚动条，仅禁用点击遮罩关闭。
为什么Modal弹出后背景页面多出横向滚动条
根本不是Modal本身溢出，而是Bootstrap在
上加了modal-open类后，自动注入padding-right: 17px（值随系统滚动条宽度浮动）来补偿纵向滚动条消失——这个padding只加在右边，没加左边，导致body总宽度变大，触发横向滚动条。macOS或用了scrollbar-width: none的环境里，这个值可能为0，反而造成内容右移错位。
data-bs-backdrop="static"直接跳过补偿逻辑
这是最轻量、无副作用的解法：加这个属性后，Bootstrap完全不触发modal-open类添加、不设padding-right、不改overflow，但遮罩层和ESC关闭照常工作。
-
data-bs-backdrop="static"必须写在<div class="modal">标签上，例如：<div class="modal fade" data-bs-backdrop="static"> - 不影响
data-bs-keyboard="false"等其他属性，可叠加使用 - 副作用仅是禁用点击遮罩关闭，对权限确认、操作提示等场景完全够用
- 删掉该属性即可恢复默认行为，无残留、无兼容性风险
必须保留点击遮罩关闭时怎么办
不能硬覆盖body { padding-right: 0 !important }——内联样式优先级更高，且17px是动态估算值，写死会错位。真正可控的做法是手动接管滚动控制：
- 监听
show.bs.modal事件，执行document.body.style.overflow = 'hidden' - 确保不触发
modal-open类添加（即不用默认backdrop） - 若有多层Modal，监听
hidden.bs.modal时检查document.querySelectorAll('.modal.show').length > 0再决定是否恢复overflow - 所有
position: fixed元素（如.fixed-top导航栏）需加.is-fixed类，否则视觉错位仍会发生
别忽略fixed元素的错位问题
position: fixed元素脱离文档流，不响应body的padding-right，所以当其他内容左缩时，它“原地不动”，看起来就像右移了。这不是Bug，是CSS定位机制决定的。
- 给所有
fixed-top、fixed-bottom或自定义position: fixed元素统一加.is-fixed类 - Bootstrap内部会基于这个类同步补偿逻辑，但前提是用了默认backdrop；若用
data-bs-backdrop="static"，则无需此步 - 如果已存在自定义fixed样式，检查是否漏加
right: 0或transform偏移校正
is-fixed类漏了。 
