line-height 设无单位数字（如1.5）最稳妥，因其相对当前font-size自动缩放，避免继承塌陷或溢出；影响行框高度而非字体大小，需配合font-size调整以保持视觉节奏。
line-height 值设为无单位数字最稳妥
直接写 line-height: 1.5 比 line-height: 1.5em 或 line-height: 24px 更可靠。无单位数字是相对于当前元素字体大小的倍数，会随 font-size 自动缩放，避免子元素继承后行高塌陷或溢出。
常见错误是用像素值固定行高，一旦父级字号变大（比如响应式中 font-size 增至 20px），line-height: 24px 就显得过紧；而 line-height: 1.5 会自动变成 30px，保持视觉节奏一致。
- 正文段落推荐
line-height: 1.5～line-height: 1.6 - 标题可略紧凑，如
line-height: 1.2～line-height: 1.3 - 小号文字（如
font-size: 12px）慎用line-height: 1，易造成字粘连
line-height 影响行框高度，但不改变字体本身
line-height 控制的是「行框（line box）」的最小高度，不是文字实际占据的空间。它通过在文字上下添加「半行距（half-leading）」来实现——这部分空白不可见、不可点击、也不影响 padding 或 margin 的计算。
这意味着：
立即学习“前端免费学习笔记（深入）”；
- 设置
line-height: 3不会让文字变大，只撑开行间距 - 若父容器
height固定且小于line-height计算值，文字可能被截断（尤其配合overflow: hidden时） - 垂直居中常用技巧：
height和line-height设为相同值，仅适用于单行文本
内联元素（如 <span></span>）的 line-height 行为容易误判
line-height 在内联元素上不会直接改变该元素自身高度，而是影响其所在行框的基线对齐和整体高度。如果给 <span></span> 单独设 line-height: 2，而父 <p></p> 是 line-height: 1.5，最终行高仍以父级为准，子 span 只会按自身 font-size 推算半行距参与对齐。
真正起作用的场景是：
- 父元素设
line-height，子内联元素自然继承并据此排布 - 想让某段文字「视觉上更高」，应改其
font-size或用vertical-align调整基线位置，而非单独调line-height - 需要局部增大行距，建议包裹成块级元素（如
<div> 或加 <code>display: inline-block）再设line-heightline-height 在多语言混排时需额外留意
中英文、中日韩混排时，不同字体的默认 x-height 和升部/降部差异大。比如中文宋体和英文 Arial 并排时，若只依赖浏览器默认
line-height: normal，常出现某一行文字“浮”在行中或底部贴死。解决思路不是强行统一字体，而是：
- 确保父容器有明确
font-size，并设line-height为无单位值（如1.5） - 避免用
line-height: 0清除间隙——这会破坏所有内联内容的基线排布 - 遇到极端情况（如图标 + 文字），可用
vertical-align: middle或text-top微调对齐
行高不是越宽松越好，也不是越紧凑越现代。它得让眼睛在换行时有自然停顿，又不至于让行与行之间失去联系。最容易被忽略的是：你改了
font-size，却忘了同步检查line-height是否还匹配当前字号下的呼吸感。 - 确保父容器有明确
