margin 是控制 <p> 标签段落间距的唯一有效 CSS 属性,line-height 仅影响段内行距,不改变段落间距离;因外边距合并,相邻 <p> 间距取 margin 最大值而非相加,需通过重置 margin 或触发 BFC 实现精确控制。margin 是控制 <p> 标签段落间距的唯一有效 CSS 属性,浏览器默认会给它加上下外边距(margin-top 和 margin-bottom),不是靠 line-height 或 padding。为什么改了 line-height 段落间距没变?因为 line-height 只影响段落内部行与行之间的距离,不影响段落与段落之间的空白。常见错觉是"调大 line-height 就能让段落拉开",实际只是让单个段落变高了,相邻 <p> 的上下 margin 依然重叠(发生外边距合并),视觉上间距几乎不变。如何准确调整段落间距?直接覆盖默认 margin 值即可,推荐以下方式:统一重置:用 * { margin: 0; padding: 0; } 或更稳妥的 p { margin: 1em 0; }(1em 约等于当前字体大小)按需差异化:比如标题后接段落,可写 h2 + p { margin-top: 0.5em; }避免用 padding 替代 margin:它会撑大容器、影响背景色/边框范围,且不参与外边距合并逻辑注意外边距合并:连续多个 <p> 时,相邻的 margin-bottom 和 margin-top 会取较大值,不是相加不同浏览器默认 margin 值有差异吗?有,但差别不大: Mokker AI AI产品图添加背景
相关推荐
海绵宝宝转agent4 小时前
learn-claude-code第1-5章开源学习笔记分享小奇不哭4 小时前
ROS2 单节点,RGB-D 深度相机局部路径提取 + B 样条平滑路径 + YOLOv8 障碍物检测 + 深度测距,用于移动机器人视觉局部循迹。小小龙学IT4 小时前
Python scikit-learn 机器学习库深度解析Elastic 中国社区官方博客5 小时前
将你自己的密钥用于现有 Elastic Cloud 部署2601_962071575 小时前
类变量和全局变量的查找路径有什么区别?红海云5 小时前
Jev:给智能系统做判断的模型wjkjpcba6 小时前
PCBA烧录程序是什么:PCBA包工包料厂家解析烧录与测试꯭自꯭闭꯭6 小时前
达梦事物特性及MVCC卷无止境6 小时前
独立开发者的"富矿地带":哪些垂直领域值得你押注一辈子?Java后端的Ai之路6 小时前
Python进阶探索29_eval内置函数