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

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

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

Answer 2

那么绝对定位的元素不占用空间的DOM所以外面的div就没有高度。这是它的一件事。我会鼓励你阅读它，然后用codepen测试一下，但这不是真正的地方。

Answer 3

第一个会在被移动的元素后面留下一个“鬼魂”。第二个将它完全从文档的流程中取出。