modal内容区滚动条不出现，需检查.modal-body是否被误设为overflow: hidden，并确认其是否有max-height约束和overflow-y: auto声明；父容器如.modal-dialog或.modal-content不得设height/max-height或overflow: hidden，否则会压制滚动行为。
Modal内容区滚动条不出现？检查modal-body是否被错误设为overflow: hidden
Bootstrap默认对.modal-body不做强制溢出限制，但很多项目会全局重置overflow，或在父容器（如.modal-content）上误加overflow: hidden。结果就是内容撑高后直接把整个模态框顶上去，滚动条根本不出现在内容区。
实操建议：
- 用浏览器开发者工具检查
.modal-body的computedoverflow值，确认不是hidden或clip - 确保
.modal-dialog没设max-height或height——它应该靠内部弹性布局撑开 - 避免在
.modal或.modal-content上写overflow: hidden，这是最常见误操作
需要固定高度+滚动？给modal-body设max-height和overflow-y: auto
想让内容区自己滚动、而标题/底部按钮始终可见，必须限制.modal-body高度，不能依赖.modal-dialog或.modal-content。
实操建议：
- 直接在
.modal-body上加内联样式或自定义class：.modal-body { max-height: 400px; overflow-y: auto; } - 优先用
max-height而非height，保留内容少时自动收缩的能力 - 如果用Flex布局（Bootstrap 5+默认），确保
.modal-content是flex-column，否则max-height可能失效 - 移动端要注意
max-height单位：用vh比px更安全，比如max-height: 60vh
滚动条被遮挡或样式难看？绕过Bootstrap的modal-dialog默认padding
Bootstrap 5的.modal-dialog默认有padding: 1rem，当.modal-body设了max-height，这个padding会让内容区实际可用高度变小，滚动条容易贴边被遮住，尤其在Windows Chrome下。
实操建议：
- 把
padding移到.modal-body内部元素上，而不是依赖.modal-dialog的padding - 若需微调滚动条位置，给
.modal-body加padding-right: 12px（预留滚动条宽度） - 自定义滚动条样式时，只作用于
.modal-body，避免影响全局：.modal-body::-webkit-scrollbar { width: 6px; }
动态内容导致滚动失效？别在show.bs.modal里直接操作modal-body高度
如果模态框内容是AJAX加载或Vue/React动态渲染，常有人在show.bs.modal事件里手动计算并设置.modal-body高度——这容易因DOM未就绪或CSS未生效而失败。
实操建议：
- 改用
shown.bs.modal事件，确保模态框已完全显示且尺寸稳定 - 避免JS硬编码高度，优先用CSS方案（
max-height+overflow-y） - 如果必须JS控制，用
getBoundingClientRect()读取.modal-dialog可用高度，再减去.modal-header和.modal-footer高度来算.modal-body最大值
.modal-body有没有被父级overflow: hidden压制，二是它自己有没有明确的高度约束和overflow-y声明。其他所有问题，基本都是这两点的衍生。
