566

HTML ページに div があります。ある条件に基づいてこの div を表示していますが、マウス カーソルをポイントした HTML 要素の背後に div が表示されています。

0 から 999999 までの z-index のすべての値を試しました。

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>

jQueryを使用して.divClassonclickでdivを表示および非表示にしています。<asp:hyperlink>

4

10 に答える 10

336

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

「z-インデックス」

値: 自動 | <整数> | 継承する

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

一部の値型は、整数値 (<integer> で示される) または実数値 (<number> で示される) を持つ場合があります。実数および整数は、10 進数表記のみで指定します。<integer> は、1 つ以上の数字 "0" から "9" で構成されます。<number> は <integer> にするか、0 個以上の数字の後にドット (.) と 1 つ以上の数字を続けることができます。整数と実数の両方の前に「-」または「+」を付けて符号を示すことができます。-0 は 0 に相当し、負の数ではありません。

値として整数または実数を許可する多くのプロパティは、実際には値を特定の範囲 (多くの場合、負でない値) に制限することに注意してください。

したがって、CSS 標準では基本的に z-index 値に制限はありませんが、実際にはほとんどのブラウザーが符号付き 32 ビット値 (-2147483648 から +2147483647) に制限していると思います (64 は少し上から外れて、最近では 32 ビット未満のものを使用しても意味がありません)

于 2009-01-29T10:11:14.123 に答える
170

私のテストでz-index: 2147483647は、これが OS X の FF 3.0.1 でテストされた最大値であることを示しています。整数オーバーフローのバグを発見しました: z-index: 2147483648(2147483647 + 1) と入力すると、要素は他のすべての要素の後ろに表示されます。少なくともブラウザはクラッシュしません。

z-index学ぶべき教訓は、プロパティに大きすぎる値を入力しないように注意する必要があるということです。

于 2009-05-13T07:35:52.070 に答える
23

これは 32 ビット整数の最大値です: 2147483647

次のドキュメントも参照してください: https://www.w3.org/TR/CSS22/visuren.html#z-index (負の数を使用できます)

于 2012-06-01T12:32:24.190 に答える
23

z-index経験上、正しい最大値は 2147483647だと思います。

于 2010-08-18T16:43:30.533 に答える
21

これはブラウザーによって異なります (ただし、すべてのブラウザーの最新バージョンは 2147483638 で最大になるはずです)。最大値を超えたときのブラウザーの反応も同様です。

于 2010-10-07T15:14:08.420 に答える
7

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 を争っている可能性があります。適切に z-index します。

これには、役に立ち、かなり人間味のある説明があります: http://foohack.com/2007/10/top-5-css-mistakes/  

于 2013-06-07T20:13:41.787 に答える
5

上記のユーザーは、「まあ、ほとんどのデザインで 10 を超える必要はありません」と言います。

プロジェクトによっては、Z インデックス 0 ～ 1 または Z インデックス 0 ～ 10000 のみが必要な場合があります。多くの場合、より高い数字でプレイする必要があります...特にライトボックスビューアを使用している場合(9999 が標準のようで、z-index を超えたい場合はそれを超える必要があります!)

于 2010-12-01T06:27:52.523 に答える
0

INT_MAXおそらく最も安全な方法ですが、WebKit は明らかに内部で倍精度を使用しているため、(特定の精度で)非常に大きな数を使用できます。LLONG_MAXたとえば、(少なくとも 64 ビット Chromium と WebkitGTK では) 正常に動作しますが、9223372036854776000 に丸められます。

(ただし、これほど多くの z インデックスが本当に、本当に必要かどうかを慎重に検討する必要があります…)。

于 2013-02-26T16:11:49.993 に答える