通过line-height属性设置CSS行间距，可取值为数值、长度单位、百分比或normal；推荐使用无单位数值以确保良好继承性，避免文字重叠并提升响应式设计中的可读性。
在CSS中设置行间距主要通过 line-height 属性来实现，它控制文本行与行之间的垂直间距。这个属性适用于大多数包含文本的元素，比如 p、div、span、h1-h6 等。
使用 line-height 设置行间距
line-height 可以接受多种类型的值：
- 数值（如 1.5）：最推荐的方式，表示当前字体大小的倍数，具有良好的继承性。
- 长度单位（如 20px、1.5em）：指定具体的间距大小，px 是固定值，em 相对于当前字体大小。
- 百分比（如 150%）：相对于当前元素字体大小计算。
- normal：默认值，由浏览器决定，通常约为字体大小的 1.0 到 1.2 倍。
示例：
p {
line-height: 1.6; /* 推荐：字体大小的1.6倍 */
}
<p>h1 {
line-height: 30px; /<em> 固定行高 </em>/
}</p><p>.text {
line-height: 150%; /<em> 百分比形式 </em>/
}</p>line-height 的继承机制
当 line-height 使用数值时，子元素会基于自身的字体大小重新计算行高，这是推荐做法。如果使用固定单位如 px，子元素将继承该具体值，可能导致排版不协调。
立即学习“前端免费学习笔记（深入）”；
例如：
body {
font-size: 16px;
line-height: 1.5; /* 子元素会按自身字体大小 × 1.5 计算 */
}
注意事项
- 避免使用过小的 line-height，会导致文字重叠，影响可读性。
- 在移动端或响应式设计中，建议使用无单位数值，适应不同屏幕字体大小。
- line-height 也可以用于垂直居中单行文本，将其设为与容器高度相同即可。
基本上就这些，合理使用 line-height 能显著提升文本的阅读体验。不复杂但容易忽略细节。
