-
一些z-index的技术整理
2010-07-01 09:11/点击数()
下面是平时整理的一些有关z-index层级的一些技术资料，希望对大家有所帮助。 stacking context 每个box都归属于一个stacking context,它是元素在z轴方向上定位的参考。根元素形成root stacking context，其它stacking context由定位元素设置z-index为非auto
下面是平时整理的一些有关z-index层级的一些技术资料，希望对大家有所帮助。
stacking context
每个box都归属于一个stacking context,它是元素在z轴方向上定位的参考。根元素形成root stacking context，其它stacking context由定位元素设置z-index为非auto时产生。stack level
在一个stack context中的每个box，都有一个stack level(即层叠级别，以下统一用stack level)，它决定着同一stacking context中每个box在z轴上的显示顺序。同一stacking context中，stack level值大的显示在上，stack level值小的显示在下，同一stack level的遵循后来居上的原则。不同stacking context中，元素显示顺序以父级的stacking context的stack level来决定显示的先后情况，与自身stack level无关。注意stack level和z-index并不是同一概念。stack level规则
每个stacking context中可包含块级(block)元素、内联(inline)元素、float属性元素和定位(position:relative|absolute)元素等。他们在同一父级stacking context中的显示顺序就是stack level规则。
Firefox和IE8中的stack level规则(由低到高)
父级stacking context的背景、边界
z-index值为负值的定位元素（值越小越在下）
文本流中非定位的block块级子元素
文本流中非定位的float浮动子元素
仿佛能产生stacking context和inline元素
z-index:auto/0的定位元素
z-index值为正的定位元素（值越大越在上）
IE6/IE7的stack level规则(由低到高)
父级stacking context的背景、边界
z-index值为负值的定位元素（值越小越在下）
inline元素
文本流中非定位的block块级子元素和float浮动子元素
z-index:auto/0的定位元素
z-index值为正的定位元素（值越大越在上）
本文链接：http://www.xingfu880.com/blog/css/766.html
幸福工作室--广州网站建设，广州美工设计（www.xingfu880.com）
上一篇：网页设计中美女视线的影响
下一篇：CSS外边距合并问题实验文档
