Bootstrap 5.3+ 原生支持流式排版，但需满足三条件：正确使用带断点的fs-类（如fs-md-4）、引入≥5.3版本完整CSS、避开IE/旧Safari等不支持clamp()的环境；fs-4本身是静态值1.25rem，仅fs-断点变体才触发clamp()响应缩放，且RFS默认仅作用于h1–h6等内置类，自定义元素需手动添加clamp()或变量，根字号修改会破坏rem/vw协同导致缩放失效。
Bootstrap 5.3+ 原生支持流式排版，但必须满足三个条件：用对类名、引入完整 CSS、避开不兼容环境；否则 fs-lg-4 这类写法会静默失效，看起来像“没反应”。
为什么 fs-* 类在小屏下没缩放？
常见错误是直接写 fs-4——它在所有版本里都只是静态值（1.25rem），不带断点后缀就不会触发 clamp()。真正响应式缩放只发生在带断点的变体上，比如 fs-md-4 或 fs-xl-3。
-
fs-4编译为font-size: 1.25rem（纯静态） -
fs-md-4编译为font-size: clamp(1.25rem, 4vw, 1.5rem)（小屏取 min，大屏锁死 max，中间线性过渡） - 写了
fs-3 fs-lg-4，实际是“lg 及以上用 clamp，lg 以下回退到fs-3的静态值”，不是叠加计算
RFS 为什么对自定义元素无效？
RFS（Responsive Font Sizes）在 Bootstrap 5 中默认启用，但它只注入到内置语义类中：h1–h6、.display-*、.lead。你写的 <p class="my-text"> 或 <span> 不会自动获得流体行为。
- 要让自定义元素响应，得手动加
font-size: clamp(1rem, 2.5vw, 1.25rem) - 或复用 Bootstrap 的 CSS 变量，比如
font-size: clamp(var(--bs-font-size-base), 2.5vw, calc(var(--bs-font-size-base) * 1.2)) - 第三方组件（如
select2的下拉项）字体也不会被 RFS 影响，必须单独处理
IE 和旧 Safari 下字体“卡死”怎么办？
clamp() 在 IE 全系、Safari ≤13.1 中完全不识别，浏览器直接忽略整条声明，fallback 到前一条 font-size 声明（如果有）。所以如果你只写一行 font-size: clamp(...)，旧浏览器就只能看到默认字号。
立即学习“前端免费学习笔记（深入）”；
- 安全写法是双声明：
font-size: 1.25rem; font-size: clamp(1.25rem, 4vw, 1.5rem); - 加
@supports (font-size: clamp(0, 0, 0))包裹可做特性检测，但多数项目直接双写更省事 - 安卓 4.4–6.0 的 WebView 对
calc()支持不稳定，而部分 RFS 回退路径依赖它，建议补一层纯 rem fallback
最容易被忽略的是根字号改动的影响：改了 :root { font-size: 18px }，所有 rem 基准跟着变，但 vw 部分不变，结果小屏下 clamp() 的 min 值实际变大，缩放区间被压缩甚至消失——这不是 bug，是单位混用的必然结果。
