space-y对段落没反应的最常见原因是父容器使用flex或grid布局，导致space-y-失效；它仅适用于普通文档流中的相邻块级兄弟元素，此时应改用gap-y-或确保父容器为block流。
为什么 space-y 对段落没反应？
最常见原因是段落（<p>）默认是块级元素，但它们的父容器没启用文档流布局——比如用了 flex 或 grid，这时 space-y-* 完全失效。它只对普通流中相邻的兄弟块元素起作用。
- 父容器是
<div>且没加任何布局类 →space-y-4可用 - 父容器加了
flex→ 改用gap-y-4，否则无效 - 父容器是
<article>或自定义语义标签 → 确保没被 CSS 重置为display: inline - 段落之间夹了空格、注释或文本节点 →
space-y-*会跳过非块级兄弟，视觉上“断开”
prose 类是否能替代手动设段落间距？
可以，但不是简单加个类就完事。prose 是 Typography 插件提供的语义化排版系统，它内部已为 <p> 设了 margin-bottom: 1rem（配合 prose-base），并自动处理首尾段落的 mb-0 和响应式缩放。
- 必须搭配
max-w-类使用，否则大屏下段落过宽，间距感被稀释 - 如果项目改过根字体大小（如
html { font-size: 62.5%; }），prose-base的实际行距会变小，需显式加prose-lg补偿 - 不要和
space-y-*混用：两者都作用于margin-bottom，容易叠加或冲突 - 想微调段落间距？优先改插件配置里的
paragraph项，而不是覆盖.prose p
手动控制段落间距时，mb-* 和 space-y-* 怎么选？
看结构意图：mb-* 是单个段落的“自身外边距”，space-y-* 是“一组兄弟元素之间的间隙”。段落是否成组、是否需要统一节奏，决定了工具选择。
- 只有几个
<p>连续出现 → 用space-y-4更简洁，自动跳过末段 - 段落中间穿插了
<h2>、<blockquote>或按钮 →space-y-*失效，得用mb-4+last:mb-0 - 要兼容 IE →
gap-y不可用，只能退回到mb-4 last:mb-0 - 动态渲染段落（如 Markdown 转 HTML）→
space-y-*更可靠，不依赖 class 是否写在每个<p>上
响应式段落间距怎么写才不漏断点？
Tailwind 移动优先，断点类不会自动继承基础值。只写 md:space-y-6，小屏下其实是 space-y-0 —— 因为没声明基础值。
立即学习“前端免费学习笔记（深入）”；
- 安全写法：
space-y-2 sm:space-y-3 md:space-y-4，从最小断点开始逐级增强 - 若用
prose，响应式靠prose-sm/prose-base切换，但它们不自动带断点前缀，需手动组合如prose prose-sm sm:prose-base - 避免
md:mb-6单独用：它只改中屏段落底部距，上下文其他段落仍用默认值，节奏断裂 - 调试时直接看浏览器 computed 样式里生效的是哪条
margin-bottom，比猜更快
mb-*），是兄弟组的节奏（space-y-*），还是语义内容的呼吸感（prose）。选错层级，后面所有调整都会越来越拧。 
