Z- 색인의 최소값과 최대 값은?

내 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>

div를 표시하고 숨기고 있습니다. .divClass<asp:hyperlink>jQuery를 사용하여 onclick으로 .

┌──────────────────────┬───────────────────┬──────────────────────────────────┐
│ Browser              │ Max z─index value │ When exceeded, value changes to: │
╞══════════════════════╪═══════════════════╪══════════════════════════════════╡
│ Firefox 0 - 2        │ 2147483647        │ element disappears               │
├──────────────────────┼───────────────────┼──────────────────────────────────┤
│ Firefox 3            │ 2147483647        │ 0                                │
├──────────────────────┼───────────────────┼──────────────────────────────────┤
│ Firefox 4+           │ 2147483647        │ 2147483647                       │
├──────────────────────┼───────────────────┼──────────────────────────────────┤
│ Safari 0 - 3         │ 16777271          │ 16777271                         │
├──────────────────────┼───────────────────┼──────────────────────────────────┤
│ Safari 4+            │ 2147483647        │ 2147483647                       │
├──────────────────────┼───────────────────┼──────────────────────────────────┤
│ Internet Explorer 6+ │ 2147483647        │ 2147483647                       │
├──────────────────────┼───────────────────┼──────────────────────────────────┤
│ Chrome 29+           │ 2147483647        │ 2147483647                       │
├──────────────────────┼───────────────────┼──────────────────────────────────┤
│ Opera 9+             │ 2147483647        │ 2147483647                       │
└──────────────────────┴───────────────────┴──────────────────────────────────┘

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

'Z- 색인'

값 : 자동 | <정수> | 상속

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

일부 값 유형에는 정수 값 (<정수>로 표시) 또는 실수 값 (<번호>로 표시)이있을 수 있습니다. 실수와 정수는 십진 표기법으로 만 지정됩니다. <정수>는 하나 이상의 숫자 "0"~ ​​"9"로 구성됩니다. <숫자>는 <정수>이거나 0 개 이상의 숫자 다음에 점 (.)과 하나 이상의 숫자가 될 수 있습니다. 부호를 나타 내기 위해 정수와 실수 모두 "-"또는 "+"가 앞에 올 수 있습니다. -0은 0과 같으며 음수가 아닙니다.

정수 또는 실수를 값으로 허용하는 많은 속성은 실제로 값을 특정 범위, 종종 음이 아닌 값으로 제한합니다.

따라서 기본적으로 CSS 표준에는 z-index 값에 대한 제한이 없지만 대부분의 브라우저는 실제로 부호있는 32 비트 값 (−2147483648 ~ +2147483647)으로 제한합니다 (64는 약간 떨어짐). 요즘 32 비트 미만의 것을 사용하는 것은 의미가 없습니다.)

내 테스트는 z-index: 2147483647OS X 용 FF 3.0.1에서 테스트 한 최대 값 임을 보여줍니다 . 정수 오버플로 버그를 발견했습니다. 입력하면 z-index: 2147483648(2147483647 + 1) 요소는 다른 모든 요소 뒤에 있습니다. 적어도 브라우저는 충돌하지 않습니다.

그리고 배울 점은 z-index속성이 너무 큰 값을 입력하면주의해야한다는 점 입니다.

Z- 색인 의 최소값 은 0입니다 . 최대 값은 브라우저 유형에 따라 다릅니다.

최대 값을 초과 할 때 브라우저의 반응과 마찬가지로 브라우저에 따라 다릅니다 (모든 브라우저의 최신 버전은 2147483638으로 최대 값을 초과해야 함).

http://www.puidokas.com/max-z-index/

32 비트 정수의 최대 값 : 2147483647

다음 문서도 참조하십시오 : https://www.w3.org/TR/CSS22/visuren.html#z-index (음수가 허용됨)

경험 z-index이 없으면 올바른 최대 값 은 2147483638입니다.

Z- 색인은 해당 요소에 적용 position: relative;되거나 position: absolute;적용된 요소에 대해서만 작동 합니다. 이것이 문제가 아니라면 더 유용한 예제 페이지가 필요합니다.

편집 : 좋은 의사는 이미 최대한의 설명을 넣었지만 빠른 버전은 최소값이 음수와 최대 값이 될 수 없기 때문에 최소값은 0이라는 것입니다. 대부분의 디자인에서 실제로 10 이상으로 올라갈 필요는 없습니다.

부모 / 형제에 지정된 z- 색인이 없기 때문에 z- 색인이 작동하지 않는 경우가 종종 있습니다.

당신이 가지고 있다면 :

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

# 1을 z-index 0으로 설정하면 z-index를 사용하는 형제가 독립 스택에 넣은 형제는 이제 동일한 스택에 있습니다. z- 색인이 올바르게 표시됩니다.

이것은 유용하고 상당히 인간화 된 설명이 있습니다 : http://foohack.com/2007/10/top-5-css-mistakes/  

위의 사용자는 "음, 대부분의 디자인에서 실제로 10을 넘을 필요는 없습니다."라고 말합니다.

프로젝트에 따라 z- 인덱스 0-1 또는 z- 인덱스 0-10000 만 필요할 수 있습니다. 특히 라이트 박스 뷰어를 사용하는 경우 (9999가 표준 인 것으로 보이며 z- 색인을 위로 표시하려면 해당 숫자를 초과해야합니다.)

하지만 INT_MAX아마도 가장 안전한 내기이다, 웹킷은 분명히 내부적으로 복식을 사용하여 허용 매우 큰 (특정 정밀도) 숫자를.LLONG_MAX예를 들어 (64 비트 Chromium 및 WebkitGTK에서 이상) 제대로 작동하지만 9223372036854776000으로 반올림됩니다.

(여러분이 정말로 많은지 신중히 고려해야하지만, 이 많은 z 지수가 정말로 필요합니다…).