Modal文字不随窗口缩放，根本原因是使用px等绝对单位或未启用视口适配；应改用clamp()（如font-size: clamp(0.875rem, 2.2vw, 1.25rem)）并提高选择器权重覆盖.modal-content截断，同时确保viewport meta正确。
Modal里文字不随窗口缩放？别用font-size: 16px硬写
bootstrap modal默认不响应窗口缩放，文字大小固定，一缩小就溢出或留白过多。根本原因是css里用了绝对单位（如px）或未启用视口单位适配。解决思路不是改bootstrap源码，而是用现代css单位+容器约束控制。
- 优先用
vw（视口宽百分比）或clamp()替代固定font-size，例如font-size: clamp(1rem, 2.5vw, 1.5rem) - 给Modal正文容器加
max-width和padding，避免小屏时文字挤成一团 - 禁用
text-zoom（Safari旧版可能触发意外缩放），显式设置text-size-adjust: 100%
用clamp()实现平滑缩放，避开Safari兼容性坑
clamp(min, preferred, max)是目前最可控的响应式字号方案，但iOS Safari 14.5+才完全支持。若需兼容更老版本，得降级为媒体查询+vw组合。
- 推荐写法：
font-size: clamp(0.875rem, 2.2vw, 1.25rem);—— 小屏保最小可读性，大屏不撑爆容器 - 注意：
vw基于整个视口宽度，Modal宽度通常小于视口，所以系数要调小（比如1.8vw比3vw更稳） - 如果Modal内容含
h1/p等多级标题，每级单独设clamp，别只改.modal-body根元素
Bootstrap 5.3+ Modal结构限制导致font-size继承失效
新版Bootstrap Modal内部用.modal-content包裹，它默认设了font-size: 1rem，会截断父级的相对单位传递。直接在.modal-body设font-size常被覆盖。
- 必须提高选择器权重：
.modal .modal-body p { font-size: clamp(...); }或用!important（仅当局部覆盖时） - 检查Computed Styles确认最终生效值——常见错误是DevTools显示
16px，实际是Bootstrap的font-size: 1rem在根:root里被设为16px，需同步改:root或用rem相对基准 - 如果用了
data-bs-backdrop="static"，确保body没被加modal-open后强制overflow: hidden影响布局流
移动端真机测试时文字突然变小？检查viewport meta
很多项目漏设<meta name="viewport" content="width=device-width, initial-scale=1">，导致iOS Safari强制缩放页面，连带Modal内文字异常缩小。
- 必须确保HTML头部有该meta标签，且
content值不含user-scalable=no（否则clamp失去意义） - Android Chrome对
vw计算更严格，但部分国产浏览器（如UC）会把Modal弹出时的视口宽度算错，此时用max-width: 90vw限制Modal自身宽度比死磕字体更有效 - 真机调试时，在Safari开发者工具里勾选“Disable viewport scaling”能快速验证是否是meta问题
clamp三个参数的平衡点、Modal容器宽度、以及设备DPR。调参时先固定min和max，再微调中间的vw系数——差0.3vw，小屏下可能就差两行换行。
