clamp()三参数为min、preferred、max，即最小值、理想值（须含vw等动态单位）、最大值；浏览器取preferred计算值，若小于min则取min，大于max则取max，否则取preferred，三者共同确保字号在视口变化时平滑自适应且不越界。
clamp() 能实现无需媒体查询的流式字体，但必须理解它的三值逻辑和视口单位限制——直接套公式容易在小屏上字体过大、大屏上增长乏力。
什么是 clamp() 的三个参数？
clamp() 接收三个值：min、preferred、max，格式为 clamp(min, preferred, max)。它不是简单插值，而是：当 preferred 小于 min 时取 min；大于 max 时取 max；否则取 preferred（可为带 vw 的表达式）。
常见错误是把 preferred 写成固定值（如 clamp(1rem, 2rem, 3rem)），这等同于静态值，完全失去响应能力。
-
min应设为最小可读尺寸（如1rem或16px），避免小屏文字过小 -
preferred必须含相对单位（推荐vw），例如2.5vw + 1rem，才能随视口变化 -
max是安全上限（如3rem），防止大屏下字体失控
为什么 2.5vw + 1rem 比纯 4vw 更可靠？
纯 vw（如 clamp(1rem, 4vw, 3rem)）在窄屏下极易超标：iPhone SE（375px）时 4vw = 15px，刚好卡在 min 边界，但稍宽一点（如 414px）就跳到 16.56px，而用户可能需要更稳的起始尺寸。
用线性表达式（如 2.5vw + 1rem）能锚定基线：
- 在 320px 宽度下：
2.5vw = 8px，加1rem ≈ 16px得24px，大概率高于min，实际生效 - 在 1920px 下：
2.5vw = 48px，加16px得64px，但被max截断，确保不溢出 - 斜率
2.5可调：数值越小，字体随宽度变化越平缓；越大则越敏感
实际项目中怎么写才不踩坑？
直接复制网上示例常导致移动端文字偏大、行高塌陷或与设计稿偏差。关键要结合设计系统校准：
- 先确定设计稿基准：比如 Figma 中标题在 375px 宽度下应为
24px，在 1440px 下为48px，据此反推公式 - 用两点式线性方程求解斜率：若
width₁ = 375,size₁ = 24；width₂ = 1440,size₂ = 48，则斜率m = (48−24)/(1440−375) ≈ 0.0225，即2.25vw，再补常数项得2.25vw + 15.9px - 务必用
rem或px写min/max，避免嵌套em引发继承放大 - 测试真机：iOS Safari 对
clamp()支持完好，但旧版 Android WebView（Chrome font-size: 1.5rem
最易被忽略的是：字体大小变化后，line-height 和 letter-spacing 往往没同步响应——它们不会自动随 font-size 缩放，必须单独用 clamp() 或视口单位重写。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
