clamp()三参数须为min、preferred、max，逻辑是max(min, min(preferred, max))；必须统一单位（全px或全rem），preferred须含vw等动态单位，min/max设可读下限与布局上限。
clamp() 的三个参数到底怎么填
直接套公式：clamp(最小值, 用视口单位计算的中间值, 最大值)。比如希望字体在 320px 宽度下是 16px，1920px 下是 24px，中间线性过渡，就写 clamp(16px, 4vw + 8px, 24px)——这里 4vw + 8px 是解出来的：当 4vw + 8px = 16px 时，vw = 2（即屏幕宽 500px），但更稳妥的做法是代入两个端点反推斜率。常用组合是 clamp(14px, 2.5vw, 20px)，它在 560px 屏幕（14 ÷ 2.5）开始生效，到 800px（20 ÷ 2.5）达到上限。
为什么 font-size: clamp(...) 有时没反应
常见原因有三个：
-
clamp()需要浏览器支持（Chrome 78+、Firefox 75+、Safari 13.1+），旧版 Safari 可能只认min()/max()单独使用 - 父容器设置了
font-size: 0或transform: scale()，会干扰相对计算，优先检查祖先元素的字体继承链 - 你写了
font-size: clamp(1rem, 2.5vw, 1.5rem)，但1rem在根元素是 16px，而2.5vw在小屏下可能小于 16px，此时最小值生效，看起来“不动”——换成clamp(14px, 2.5vw, 1.5rem)更可控
和媒体查询比，clamp() 真的更省事吗
是，但有前提：
- 适合「平滑过渡」场景，比如标题字号随宽度连续变化；如果需要在 768px/1024px/1440px 三档突变式调整，媒体查询反而更清晰
-
clamp()里不能写em或rem做基准（除非你明确控制根字体），因为vw是绝对视口单位，混用容易失焦；推荐统一用px或纯vw - 性能上无差异，两者都由渲染引擎实时计算；但
clamp()减少了 CSS 规则数量，对维护友好
移动端适配时容易忽略的细节
iPhone 的「缩放文字」设置（设置 > 显示与亮度 > 文字大小）会影响 rem，但不影响 vw 和 clamp() 中的像素值。所以如果你混合用了 clamp(16px, 2.8vw, 1.25rem)，用户调大系统字体后，1.25rem 会突然跳变，破坏平滑感。稳妥做法是全部用 px 或全部用 vw，例如 clamp(16px, 2.8vw, 20px)。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
