下拉菜單總是顯示在h1下面？

Question

我有一個下拉菜單，雖然我已經設置z-index爲999的每個可能的元素，下拉總是顯示在h1下面。

爲什麼會發生這種情況？

這是在所有瀏覽器中。

<ul> 
    <li><a>Menu item</a> 
     <ul> 
      <li><a>Sub item 1</a></li> 
      <li><a>Sub item 2</a></li> 
      <li><a>Sub item 3</a></li> 
      <li><a>Sub item 4</a></li> 
     </ul> 
    </li> 
</ul> 

<div id="article"><h1>Test title</h1></div> 

以上是HTML使用 我試圖在所有<ul>'s <li>'s and <a>'s

樣品的CSS設置的999的z索引的基本display:block;和float: left;酌情 ul li ul被設定爲display: none和是設置爲display: block;時ul li:hover

然而，當子菜單重疊<h1>時，菜單將在其下面。

菜單高於<div id="article">背景顏色，但<h1>

Answer 1

z-index僅適用於定位元素（位置：絕對，位置：相對或位置：固定）。另外，除了Topera寫的內容，還可以給菜單的div或ul給出比h1更大的z-index值。 最好是如果我們有一些代碼。

Answer 2

的Z-index文字下方：999必須在菜單中，而不是在所有其他元素。