line-height 和 margin-bottom 必须分开设；移动端段落行高宜用 1.4–1.5（如 14px 配 1.4），禁用 % 或 em 单位；段间距必须用 margin-bottom，不可依赖 line-height；flex 中 line-height 可能“假失效”，需补 p 的 margin；图片混排时 line-height 过小会导致 vertical-align 异常。
line-height 和 margin-bottom 必须分开设，只调一个会出视觉 bug。
移动端段落行高别硬套桌面值
桌面端正文常用 line-height: 1.6，但移动端小字号（比如 font-size: 14px）下，这个值会让行框过高，段落节奏被割裂。实测在多数手机上，1.4–1.5 更稳：
- 14px 字号配
1.4→ 行高 ≈ 19.6px，文字不挤也不飘 - 16px 字号可上到
1.5，但别超1.55，否则多行段落看起来像“断开” - 避免用
%或em做单位——它们在嵌套rem布局里容易被放大，直接用无单位数值最可控
段间距必须靠 margin，不是靠拉大 line-height
有人把 line-height 设成 2.0 来“撑开段落”，结果单一段落里每行都空得吓人。这是混淆了两个概念：
-
line-height控制的是**段内行与行之间**的距离 -
margin-bottom才控制**段与段之间**的空白 - 推荐组合：
line-height: 1.45+margin-bottom: 1.2em，em单位能随字体缩放，比固定px更适应用户系统字号设置
注意 line-height 在 flex 容器里的“假失效”
如果文章详情页用了 display: flex 包裹 p，你会觉得 line-height 没反应——其实它生效了，只是容器高度由内容撑开，没强制约束。这时候要补一手：
- 给
p加margin: 0.8em 0，比依赖line-height更直观 - 如果想让段落垂直居中，别调
p的line-height，改在父级 flex 容器上加align-items: flex-start或justify-content: center - 特别留意图片混排场景：
vertical-align的基准是当前行的行框，line-height设太小会导致图片“悬空”或下沉
真正难的不是写对那两行 CSS，而是记住：段内密度和段间节奏是两个独立变量，强行用一个属性兼顾，迟早要返工。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
