我的HTML页面中有一个DIV.我根据某些条件展示了这个DIV.但DIV显示在我指向鼠标光标的任何HTML元素后面.
我已经尝试了从0到999999的Z-INDEX属性的所有值.
任何人都可以告诉我为什么会发生这种情况?
CSS的Z-INDEX属性是否有任何最小值或最大值?
例如,以下HTML在ascx控件中定义:
.divClass {
position: absolute;
left: 25px;
top: 25px;
width: 320px;
height: 300px;
z-index: 1000;
}
CSS是:
Some Data
我正在使用主页上的+ Jquery显示和隐藏特定的DIV for Hyperlink.
???????????????????????????????????????????????????????????????????????????????
? 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且不是负数. 请注意,许多允许整数或实数作为值的属性实际上将值限制为某个范围,通常为非负值.
所以基本上CSS标准中的z-index值没有限制,但我猜大多数浏览器在实践中将它限制为带符号的32位值(-2147483648到+2147483647)(64会有点偏离顶部,它这些天使用少于32位的东西是没有意义的)
我的测试显示这z-index: 2147483647
是最大值,在OS 3.0的FF 3.0.1上测试过.我发现了一个整数溢出错误:如果你键入z-index: 2147483648
(这是2147483647 + 1),元素就会落后于所有其他元素.至少浏览器没有崩溃.
要学习的教训是,你应该注意为z-index
属性输入太大的值,因为它们会缠绕在一起.
Z-index的最小值为0 ; 最大值取决于浏览器类型.
根据经验,我认为正确的最大值z-index
是2147483638.
这取决于浏览器(尽管所有浏览器的最新版本最大值应为2147483638),浏览器在超过最大值时的反应也是如此.
http://www.puidokas.com/max-z-index/
它是32位整数的最大值:2147483647
另请参阅文档:https://www.w3.org/TR/CSS22/visuren.html#z-index (允许使用负数)
Z-Index仅适用于具有position: relative;
或position: absolute;
应用于它们的元素.如果这不是问题,我们需要看一个示例页面更有帮助.
编辑:好医生已经给出了最全面的解释,但快速版本是最小值为0,因为它不能是负数和最大值 - 好吧,对于大多数设计,你永远不需要超过10.
我发现,如果z-index不能正常工作,因为它的父/兄弟没有指定的z-index.
所以如果你有:
对于点击/悬停空间,第3项甚至第4项可能正在竞争#2,但是如果你将#1设置为z-index 0,那么z-index将它们放在独立堆栈中的兄弟姐妹现在在同一个堆栈中并将z-index正确.
这有一个有用且相当人性化的描述:http://foohack.com/2007/10/top-5-css-mistakes/
上面的用户说:“嗯,对于大多数设计,您真的不需要超过10。”
根据您的项目,您可能只需要z-index 0-1或z-indexes 0-10000。您通常需要使用更高的数字...特别是如果您正在与灯箱查看器一起使用(9999是标准格式,并且如果要使其z-index达到最高,则需要超过该数字!)