modal-fullscreen需加在modal-dialog上且Bootstrap≥5.2，用带-down后缀断点类（如modal-fullscreen-lg-down），并为modal-body设max-height和overflow-y:auto确保滚动。
直接加 modal-fullscreen 类不一定全屏，它必须加对位置、配对断点、且版本 ≥5.2 —— 否则只是个无效字符串。
为什么 modal-fullscreen 加了没反应
最常见原因是：类名写错位置或 Bootstrap 版本太低。
-
modal-fullscreen必须加在<div class="modal-dialog">上，加在modal或modal-content上完全无效 - Bootstrap 5.1 及更早版本压根不认识这个类，浏览器会静默忽略；确认版本 ≥5.2（推荐 5.3.3）
- 5.2 中
modal-fullscreen（无后缀）不生效，必须用带-down后缀的变体，比如modal-fullscreen-lg-down - 若用构建工具（Vite/Webpack），检查是否因 tree-shaking 漏掉了对应 CSS 规则
怎么选对断点后缀才能真全屏
后缀不是“起始宽度”，而是“上限宽度”——lg-down 表示 ≤992px 全屏，超过就退回到默认尺寸。
- 想所有屏幕都全屏：用
modal-fullscreen-sm-down（sm 是最小断点，等价于无条件启用） - 桌面端也要全屏（常见需求）：优先试
modal-fullscreen-lg-down（覆盖到 1199px）；若需 ≥1200px 也全屏，改用modal-fullscreen-xl-down - 别混用多个后缀，比如同时写
modal-fullscreen-md-down modal-fullscreen-lg-down，后者会覆盖前者
modal-body 滚动失效或内容被截断
全屏 ≠ 自动可滚动。modal-fullscreen 只控制 modal-dialog 的宽高和定位，滚动行为由 modal-body 自己决定。
- 必须给
modal-body设max-height: calc(100vh - 120px)（120px 是 header + footer 实际高度，按需调整） - 必须配
overflow-y: auto，只设max-height不会触发滚动条 - 移动端 Safari 需额外加
-webkit-overflow-scrolling: touch启用惯性滚动 - 避免用
height: 100%——modal-content默认没高度，结果是 0
手动覆盖 width/margin 很危险
有人试过直接给 modal-dialog 加 width: 100vw; margin: 0，这会破坏 Bootstrap 内部逻辑。
-
transform: translate(-50%, -50%)仍按原始尺寸计算偏移，导致模态框实际位置偏右偏下 -
modal-content的内边距（padding）依赖modal-dialog的max-width计算，硬设 width 会让圆角、间距塌缩 - iOS Safari 下
100vw会因地址栏显示/隐藏抖动，而原生modal-fullscreen内部用了width: -webkit-fill-available兜底 - 如果父容器（如某个 wrapper div）有
overflow: hidden或固定高度，也会压制全屏表现，需一并排查
真正难的不是“怎么撑满”，而是“撑满后内容怎么不溢出、滚动怎么不卡、焦点怎么不丢、backdrop 点击怎么不失效”——这些细节全藏在 modal-body 和父级容器的交互里，容易被当成样式问题忽略。
