我有一个div在我的HTML页面。我基于某些条件显示这个div,但是div显示在我指向鼠标光标的HTML元素后面。

我已经尝试了z-index从0到999999的所有值。有人能告诉我为什么会这样吗?

CSS的Z-INDEX属性是否有最小值或最大值?

.divClass { 位置:绝对的; 左:25 px; 上图:25 px; 宽度:320 px; 身高:300 px; 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”> 一些数据 < / div > < / td > < / tr > 表> < /

我显示和隐藏div与. divclass onclick通过<asp:超链接>使用jQuery。


当前回答

我的测试表明z-index: 2147483647是最大值,在OS X的FF 3.0.1上测试。 我发现了一个整数溢出的错误:如果你输入z-index: 2147483648(这是2147483647 + 1),元素只是在所有其他元素后面。至少浏览器不会崩溃。

从中可以学到的教训是,你应该小心,不要为z-index属性输入太大的值,因为它们会绕圈。

其他回答

我的测试表明z-index: 2147483647是最大值,在OS X的FF 3.0.1上测试。 我发现了一个整数溢出的错误:如果你输入z-index: 2147483648(这是2147483647 + 1),元素只是在所有其他元素后面。至少浏览器不会崩溃。

从中可以学到的教训是,你应该小心,不要为z-index属性输入太大的值,因为它们会绕圈。

这取决于浏览器(尽管所有浏览器的最新版本的最大值应该是2147483638),也取决于超过最大值时浏览器的反应。

我发现如果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。

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

z指数最大值为2147,483,647,大于此值则为2147,483,647

‌Browser Maximum More Than Maximum
Chrome >= 29 2,147,483,647 2,147,483,647
Opera >= 9 2,147,483,647 2,147,483,647
IE >= 6 2,147,483,647 2,147,483,647
Safari >= 4 2,147,483,647 2,147,483,647
Safari = 3 16,777,271 16,777,271
Firefox >= 4 2,147,483,647 2,147,483,647
Firefox = 3 2,147,483,647 0
Firefox = 2 2,147,483,647 Bug: tag hidden

在BrowserStack中测试的所有值。

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

(尽管你应该仔细考虑你是否真的,真的需要这么多z指标…)