核心是行高（line-height）设得太小，增大 line-height 最直接有效；应优先用无单位数值（如1.5）、避免px固定；正文推荐1.5–1.7，标题1.2–1.4，按钮1.2–1.3；需在块级元素设置，慎用inline元素；可辅以letter-spacing微调，响应式建议用媒体查询或clamp()。
文字太拥挤，核心是行高（line-height）设得太小。增大 line-height 是最直接有效的解决方式，它能拉开行与行之间的垂直距离，让文本呼吸感更强、更易读。
理解 line-height 的取值逻辑
line-height 不建议用像素（px）固定死，优先使用无单位数值（如 1.5、1.6）或 rem/em 相对单位。无单位值表示“当前字体大小的倍数”，比如 font-size: 16px; line-height: 1.5; 实际行高就是 24px，且会随字号缩放，响应式更友好。
常见合理范围：
- 正文段落：1.5 – 1.7（中文推荐 1.6 左右，兼顾紧凑与可读）
- 标题（h1–h3）：1.2 – 1.4（字号大，行高可略小）
- 按钮/标签等短文本：1.2 – 1.3（避免高度过度拉伸）
避免常见踩坑点
line-height 继承自父元素，如果外层容器设置了较小的 line-height（如 1），子元素即使设了字体大小，也可能被压缩。检查 computed 样式，确认实际生效值。
立即学习“前端免费学习笔记（深入）”；
注意：不要在 inline 元素（如 span、a）上单独设置 line-height 来“调行距”——它只影响该元素自身行框高度，不改变周围文本的基线对齐，容易造成错位。行高应在块级容器（p、div、article）上统一控制。
配合 font-size 和 letter-spacing 微调
单靠 line-height 不够时，可小幅增加 letter-spacing（字间距），尤其适用于中英文混排或较细字体。例如：
p { font-size: 16px; line-height: 1.6; letter-spacing: 0.02em; }但 letter-spacing 建议控制在 -0.03em 到 +0.05em 之间，过大会破坏字词连贯性。
响应式场景下的处理建议
小屏幕（手机）上，用户手指操作多、阅读距离近，适当增大 line-height（如 1.7）比桌面端更舒适；大屏则可略收（1.55）。可用媒体查询分层设置：
@media (max-width: 768px) { p { line-height: 1.7; } }也可结合 clamp() 实现平滑过渡：
p { line-height: clamp(1.5, 1.6vw + 1.4, 1.7); }
