這兩對標籤的行爲有什麼不同（參見）？

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

第一個會在被移動的元素後面留下一個「鬼魂」。第二個將它完全從文檔的流程中取出。