我的HTML頁面中有一個div。我是基于某種條件顯示這個div的，但是這個div顯示在我將鼠標光標指向的HTML元素的后面。

我已經嘗試了z-index從0到999999的所有值。有人能告訴我為什么會這樣嗎？

CSS的Z-INDEX屬性有最小值或最大值嗎？

.divClass {
     position: absolute; 
     left: 25px; 
     top: 25px; 
     width: 320px;
     height: 300px; 
     z-index: 1000; 
}

<table cellspacing="0" cellpadding="0" width="100%">
  <tr>
    <td>
      <asp:HyperLink ID="lnkProgram" runat="server"></asp:HyperLink>
    </td>
  </tr>
  <tr>
     <td>
         <div class="divClass">
           Some Data
         </div>
     </td>
  </tr> 
</table>

http://www.w3.org/TR/CSS21/visuren.html#z-index

' z索引'

值:auto | & lt整數& gt|繼承

http://www.w3.org/TR/CSS21/syndata.html#numbers

一些值類型可能有整數 值(用& lt整數& gt)或者 實數值(用 & lt編號& gt).實數和 整數用十進制表示 僅符號。安& lt整數& gt 由一個或多個數字“0”至組成 "9".A & lt編號& gt可以是一個 & lt整數& gt，或者它可以是零或 更多數字后跟一個點(。) 后跟一個或多個數字。兩者 整數和實數可以是 前面有“-”或“+”表示 那個標志。-0相當于0，并且是 不是負數。

請注意，許多允許 作為值的整數或實數 實際上將值限制為一些 范圍，通常為非負值。

所以在CSS標準中基本上沒有對z-index值的限制，但我猜大多數瀏覽器在實踐中將其限制為帶符號的32位值(2147483648到+2147483647)(64可能有點過了，現在使用任何小于32位的值都沒有意義)

我的測試顯示z-index: 2147483647是最大值，是在FF 3.0.1 for OS X上測試的。 我發現了一個整數溢出錯誤:如果您鍵入z-index: 2147483648(即2147483647 + 1 ),則該元素會位于所有其他元素之后。至少瀏覽器不崩潰。

要吸取的教訓是，應該注意不要為z-index屬性輸入太大的值，因為它們會換行。

出于經驗，我認為正確的最大z指數是2147483647。

它是32位整數的最大值:2147483647

另見文件:https://www.w3.org/TR/CSS22/visuren.html#z-index (允許負數)

這取決于瀏覽器(盡管所有瀏覽器的最新版本應該最大值為2147483638)，超過最大值時瀏覽器的反應也是如此。

結論最大z指數值為2，147，483，647，超過該值將轉換為2，147，483，647

?Browser 最高的 超過最大值 Chrome & gt= 29 2,147,483,647 2,147,483,647 Opera & gt= 9 2,147,483,647 2,147,483,647 IE & gt= 6 2,147,483,647 2,147,483,647 Safari & gt= 4 2,147,483,647 2,147,483,647 野生動物園= 3 16,777,271 16,777,271 Firefox & gt= 4 2,147,483,647 2,147,483,647 火狐= 3 2,147,483,647 0 火狐= 2 2,147,483,647 Bug:標簽隱藏 Z-Index僅適用于具有位置的元素:relative或者位置:絕對；適用于他們。如果這不是問題，我們需要看到一個更有幫助的例子頁面。

編輯:好醫生已經給出了最完整的解釋，但是快速的版本是，最小值是0，因為它不能是負數，最大值也不能是——嗯，對于大多數設計來說，你永遠不需要超過10。

我發現，如果z-index不起作用，通常是因為它的父/兄弟沒有指定的z-index。

所以如果你有:

<div id="1">
    <a id="2" style="z-index:2"></a>
    <div id="3" style="z-index:1"></div>
    <button id="4"></button>
</div>

第3項，甚至第4項，可能會爭奪第2項的點擊/懸停空間，盡管如果您將第1項設置為z索引0，則z索引將其放在獨立堆棧中的兄弟項現在在同一個堆棧中，并將正確地進行z索引。

這有一個有益的和相當人性化的描述:http://foohack.com/2007/10/top-5-css-mistakes/

上面的一個用戶說:“好吧，對于大多數設計來說，你永遠都不需要超過10。”

根據您的項目，您可能只需要z索引0-1或z索引0-10000。你經常需要玩更高的數字...特別是如果你正在使用lightbox瀏覽器(9999似乎是標準，如果你想超過他們的z-index，你需要超過它！)

使用calc()可以非常容易地寫出z-index的最大值和最小值。

最大值:

#some-id {
  z-index: calc(9e999)
}

最小值:

#some-id {
  z-index: calc(-9e999)
}

calc()瀏覽器兼容性(& lt編號& gt價值支持) Firefox - 48+ Safari - 7+版本 IE - 9+ 歌劇- 18歲以上 鉻- 31+ 邊緣- 12+ 雖然INT_MAX可能是最安全的選擇，但是WebKit顯然在內部使用了doubles，因此允許非常大的數字(達到一定的精度)。LLONG_MAX例如可以很好地工作(至少在64位Chromium和WebkitGTK中)，但會四舍五入到9223372036854776000。

(雖然你要仔細考慮你是不是真的真的需要這么多z指數……)。

z索引是危險的:

它具有傳染性:如果一個標簽獲得了z-index，更多的標簽將被感染，以覆蓋舊的標簽。 它將膨脹:如果一個標簽得到z-index:1；，更多的標簽將不得不使用z-index:2；，z指數:3；...z-index:max | | min；，嘣！。 使用z-index:max | | min；尤其危險。如果一個標簽得到了z-index: max，其他標簽將很難覆蓋，整個項目將逐漸失去控制。