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产品图添加背景
相关推荐
Htr_2 小时前
Cortex 使用指南:开源 API 知识层宸津-代码粉碎机2 小时前
Spring AI 高危CVE漏洞深度复盘|生产禁跑版本汇总+临时防御+修复方案Roadinforest2 小时前
NoSQL的最终一致性:真的可靠吗?敲代码的嘎仔2 小时前
用 Redis 合并写 + DelayQueue 延迟检测,把视频播放进度写库频率降到 1/60承渊政道3 小时前
Python IDLE鸿蒙PC适配全记录:用 ArkUI 重建编辑、运行、Shell 与基础调试闭环zjh9005303 小时前
Kotlin黑科技:空安全与Java兼容性深度解析码农哈丁3 小时前
从 JVM 到 Cargo:把整个 Kotlin 项目移植到 Rust 的踩坑实录黄昏恋慕黎明3 小时前
博客论坛技术迭代我叫汪枫3 小时前
RAG 进阶:切分、检索、重排序,以及它和 Agent、微调、MCP 都是什么关系承渊政道3 小时前
PostgreSQL 鸿蒙 PC 适配全记录:从原生交叉编译到 HNP 数据库服务闭环