下拉菜單中，絕對和相對

Question

林學習CSS，所以我開始創造一個下拉菜單，我有一個問題。這裏是我的導航結構：

<nav> 
    <ul> 
    <li>style 1 
     <ul class="sub-menu menu-1"> 
     <li>uno</li> 
     <li>dos</li> 
     <li>tres</li>  
     </ul> 
    </li> 
    <li>style 2 
     <ul class="sub-menu menu-2"> 
     <li>uno</li> 
     <li>dos</li> 
     <li>tres</li> 
     </ul> 
    </li> 
    <li>style 3 </li> 
    <li>style 4 </li> 
    </ul> 
</nav> 

我的問題是：爲什麼必須在每個li從子菜單中定位絕對的，而它的母公司必須是相對於爲了使子砸下去？ 如果我不理，我得到以下（它就向下導航的整個區域，而不僅僅是子菜單）：

但如果我設置子菜單的父的相對位置，並設置爲絕對子菜單的位置，它的工作原理：

我想知道爲什麼發生這種情況，絕對和相對位置如何運作完全使它工作。謝謝！

Answer 1

絕對元件相對於最近定位的父/祖先定位。如果絕對定位的元素沒有定位的父元素，它將使用文檔主體作爲參考。