line-height 应使用无单位数值（如1.6），因其能随 font-size 动态计算，确保响应式适配与父子继承一致性；固定像素或 rem/em 值易导致布局崩坏与非线性跳变。
line-height 设为多少才自然？
默认值 normal 浏览器实际渲染约 1.0–1.2，对中文往往太挤；设成 1.5 或 1.6 是安全起点，既留出呼吸感，又不显松散。段落正文用 1.6，小字号标题可降到 1.3～1.4，大标题（如 h1）反而可拉到 1.2 避免头重脚轻。
为什么不能直接写 line-height: 24px？
固定像素值在响应式场景下会崩：字号缩小时行距不变，文字贴顶；字号放大时行距又显得空洞。更糟的是，子元素继承后可能被意外覆盖。推荐始终用无单位数值（如 1.6），它会乘以当前 font-size 动态计算，父子元素自动适配。
中英文混排时行距还是不均？
英文字符 baseline 对齐，中文汉字偏高，导致同一行内上下“浮动”不一致。解决不是调 line-height，而是加 font-feature-settings: "tnum"; 或统一用等宽字体（如 font-family: "SF Mono", "SFMono-Regular", monospace;）缓解差异。若必须混合，可对 code、kbd 等内联元素单独设 line-height: 1.2; 并 vertical-align: text-bottom; 微调。
用 rem/em 设置 line-height 会出问题吗？
会。写成 line-height: 1.6rem 看似优雅，实则把行高和根字号强绑定，一旦 :root 的 font-size 变化（比如响应式切换），所有行距会非线性跳变。正确做法是坚持无单位值——line-height: 1.6 就够了，它天然兼容 rem 字号体系。
立即学习“前端免费学习笔记（深入）”；
body {
font-size: 16px;
line-height: 1.6; /* ✅ 推荐 */
}
h1 {
font-size: 2rem; /* = 32px */
line-height: 1.2; /* ✅ 自动变成 38.4px */
}
code {
font-size: 0.9em;
line-height: 1.3;
vertical-align: text-bottom;
}真正难的不是调数字，是意识到 line-height 不是“调好看”，而是参与整个文本流的垂直节奏控制——一个值改错，可能让按钮文字截断、卡片高度错位、甚至影响无障碍阅读器的换行逻辑。
