合理设置行高是提升段落可读性的核心操作，中文正文推荐1.5～1.7，标题1.2～1.4，段落间距用margin-bottom控制，避免固定像素值和全局低行高。
合理设置行高是提升段落可读性的核心操作，关键在于让文字“呼吸自然”——既不拥挤压迫，也不松散断裂。中文排版尤其需要比英文略大的行高，因为字形方正、笔画密集，行距不足时容易视觉粘连。
正文行高推荐值：1.5～1.7（无单位）
这是最稳妥的起步区间。例如：
body { line-height: 1.6; }
该写法表示“当前字号 × 1.6”，字体变大时行高自动放大，真正响应式。避免用 line-height: 24px 这类固定像素值，否则在用户缩放、移动端适配或嵌套不同字号时极易出现文字重叠或留白失控。
- 14–16px 正文字号下，1.5～1.6 最平衡，阅读节奏舒适
- 小字号（≤13px）如脚注、表格内文，可升至 1.7～1.75，缓解识别压力
- 长段落（超5行）建议不低于 1.6，减少视线跳跃疲劳
标题行高要收紧但别压死
标题需突出力度和结构感，行高可略小，但必须守住可读底线：
- h1–h3 推荐 line-height: 1.2～1.4，加粗后仍保持字形舒展
- 绝对避免 line-height: 1，尤其对中文字体——基线紧贴、字肩挤压，影响辨识
- 若标题含多行文本（如 banner 标题），建议至少设为 1.15，并配合足够 margin-bottom 分隔
段落间距 ≠ 行高，靠 margin 控制
很多人误以为调大 line-height 就能拉开段落距离，结果导致单一段落内部行距爆炸，三行以上时反而干扰阅读流。段落之间的空白，应由 margin-bottom 独立管理：
- 推荐组合：p { line-height: 1.6; margin-bottom: 1.5em; }
- 用 em 单位（而非 px），使段距随字体缩放同步变化，维持视觉节奏一致性
- 只设 margin-bottom，不设 margin-top，防止嵌套时外边距合并（collapsing margin）出错
避开常见陷阱
这些细节看似微小，却直接影响可访问性与实际体验：
- 不在 body 上设过低全局行高（如 1.2），否则按钮、导航、标签全被压扁，触控困难、屏幕阅读器识别异常
- 避免用 <br> 换行制造段落空隙——这是结构混乱，应由 CSS 控制语义化间距
- 深色背景或小字号场景，仅增大行高不够，需同步检查对比度与段落边界是否清晰
- 使用 DevTools 的 “Computed” 面板验证真实生效值，别只看 Styles 面板——继承与层叠常导致预期偏差
