不需要为不同断点单独设置行高；应使用无单位数值（如1.5），因其相对当前font-size计算、避免嵌套失真，且适配响应式字号变化。
行高要不要随屏幕尺寸变化？
不需要为不同断点单独设置 line-height 值。用相对单位（如无单位数值、em、rem）定义行高，浏览器会自动按当前字体大小缩放，可读性自然保持——这是最轻量也最可靠的做法。
为什么无单位数值是首选？
无单位的 line-height（例如 1.5）是相对于当前元素的 font-size 计算的，不继承计算后的像素值，避免嵌套时意外放大或缩小行距。
- 写成
line-height: 1.5;→ 子元素font-size: 16px时，行高 =16 × 1.5 = 24px - 写成
line-height: 1.5em;→ 若父元素font-size是20px，子元素即使设为12px，行高仍按20px × 1.5 = 30px计算，导致失真 - 用
rem同样依赖根字号，响应式中根字号若用vw或媒体查询调整，line-height不会随之重算，容易脱节
哪些情况才需要手动干预行高？
仅当文字容器高度被严格约束（如卡片标题固定 height: 48px）、或字体家族切换导致行高视觉异常（如从 system-ui 换成 monospace）时，才在特定断点微调。但优先检查是否可通过 padding 或 min-height 缓解。
- 避免在
@media中写line-height: 1.4;→ 大部分时候只是掩盖了字号突变或盒模型问题 - 如果用了
clamp()控制字号（如font-size: clamp(1rem, 2.5vw, 1.5rem);），行高仍用无单位值即可，无需同步clamp - 多行文本截断（
display: -webkit-box）场景下，line-height必须固定，此时才需配合max-height手动计算：比如line-height: 1.4em+max-height: 2.8em（两行）
移动端超小屏下的隐性风险
当 font-size 被强制缩放到 12px 以下（如 iOS Safari 对小字号的渲染限制），无单位行高虽仍生效，但绝对值可能低于可读下限（12px × 1.2 = 14.4px）。此时应通过 min-font-size（或 min-width 配合媒体查询）守住底线，而不是拉高行高来“补救”。
立即学习“前端免费学习笔记（深入）”；
html {
font-size: clamp(12px, 2.5vw, 16px);
}
p {
line-height: 1.5; /* 自动适配，但最小字号已兜底 */
}真正影响可读性的，从来不是行高本身，而是字号与行高的比例是否稳定、容器是否留出足够呼吸空间。盯着 line-height 加媒体查询，往往说明布局约束或字体系统设计已经失衡。
