Z索引的最小值和最大值？

我的HTML页面中有一个div。我正在根据某些条件显示此div，但是div显示在指向鼠标光标的HTML元素后面。

我尝试了所有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通过<asp:hyperlink>显示和隐藏带有.divClass onclick的div。

#1楼

它是32位整数的最大值：2147483647

另请参阅文档： https : //www.w3.org/TR/CSS22/visuren.html#z-index （允许使用负数）

#2楼

虽然INT_MAX可能是最安全的选择，但WebKit显然在内部使用double，因此允许非常大的数字（达到一定的精度）。 LLONG_MAX例如可以正常工作（至少在64位Chromium和WebkitGTK中有效），但将四舍五入为9223372036854776000。

（尽管您应该仔细考虑是否真的需要这么多的z索引...）。

#3楼

一个奇怪的事实是，如果您使用Firebug之类的编辑器并在z-index放入较大的数字，则浏览器会将最大插入值替换为最大值

#4楼

我发现，如果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-index 0，则z-index的兄弟姐妹现在将它们放在独立堆栈中并将正确地对z-index进行索引。

这是一个有用且相当人性化的描述： http : //foohack.com/2007/10/top-5-css-mistakes/

#5楼

┌──────────────────────┬───────────────────┬──────────────────────────────────┐
│ 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                       │
└──────────────────────┴───────────────────┴──────────────────────────────────┘

来源：oschina

链接：https://my.oschina.net/u/3797416/blog/3159402

标签

webkit

jquery

firebug

chromium