这两对标签的行为有何不同（参见）？

Question

第一个例子

<div style="position: relative">
    <div style="position: relative; top: 10px">text</div>
</div>

第二个例子

<div style="position: relative">
    <div style="position: absolute; top: 10px">text</div>
</div>

Answer 1

绝对定位的元素不会占据 dom 中的 space，因此外部 div 将没有高度。这是它做的一件事。我鼓励您仔细阅读它并在 codepen 中测试一下，但这不是真正适合这个的地方。

Answer 2

第一个将在移动的元素后面留下 "ghost"。第二个完全脱离文档流。

Answer 3

第一个会将内部 div 10px 顶部相对于它要定位的位置定位。 第二个将内部 div 顶部 10px 定位到忽略外部 div 的填充和边框的位置，并将其从文档流中删除。