relative定位无需设置top等偏移值，元素位置不变但已获得定位上下文身份；仍占文档流空间，可作为绝对定位子元素的参考点、支持z-index和transform等特性。
relative 定位不必须写 top 值；未设置任何偏移（top、right、bottom、left）时，元素在页面中**位置不变**，视觉上确实没有变化，但它已获得“相对定位上下文”的身份。
relative 的本质是“占位不动，但可偏移”
设置 position: relative 后，元素仍保留在文档流中，原本占据的空间不变。它只是为自己创建了一个“定位上下文”，后续通过 top/right/bottom/left 才会真正移动。没设这些值 → 没偏移 → 看不出差别，但 DOM 行为已不同（例如子元素用 position: absolute 时，会相对于它定位）。
不写 top 也能触发 relative 的关键作用
- 子元素设置
position: absolute时，会以最近的relative（或absolute/fixed）祖先为参考点 —— 即使该祖先没写top - 配合
z-index实现层叠控制（static 元素无法设z-index） - 作为 transform、transition 的锚点（如
transform: translateX(10px)仍需先设relative来确保行为稳定）
常见误解：以为“没写 top 就等于没定位”
这是错的。哪怕只写 position: relative，浏览器已将其视为“已定位元素”（positioned element）。检查 computed style 可见 position: relative 生效，且 top/right/bottom/left 显示为 auto —— 这正是“未偏移但已就位”的状态。
不复杂但容易忽略。
