早前就有人对《无法冲破的等级》一文提出不同的看法,认为“无法冲破的等级”只是IE的BUG,但是我自己在做测试的时候都发现并未出现差错,所以一直都对此不以为然。事实胜于雄辩,有实例的证实我觉得我一点也没错。但是今天网友“平淡人生”提供的实例我发现完全打破了我原来的想法。后来根据对实例的分析,我发现,这里有一个问题并没有讲清楚,正是因为这点才使得这篇文章受到了一定的争议。下面我就对这个之前疏忽的问题再做一次补充:
先给出两个不同的例子来看一下:
留心一点已经发现了,这两个例子中,不同的是第一个例子中的父级有z-index属性,第二个例子中的父级没有z-index属性。但是这两个例子在IE中的效果是一样的,不论子级设为多高,都无法超越父级。但是在Firefox或是Opera等浏览器中就会出现不一样,第一个例子的情况与IE同,而第二个例子在Firefox或是Opera等浏览器中却突破了父级。
由此看来,严格的等级限制还是存在的,只是在Firefox与Opera等浏览器中对于父级如若Z-index:auto;那么子级还是会如同自由的飞鸟不会被任何物体所限制,当然前提是子级的Z-index的属性值必需要大于0。这时也许我们就理解了,其实在IE中早就默认了所有的定位元素的Z-index:0;所以才出现了无法冲破的等级。
虽然在父级没有设定Z-inex属性值时子级在Firefox与Opera浏览器中都能浮动父级之上,但是必竟IE在这点上还是有差别的。所以在使用上还是需要用到《无法冲破等级》一文中提及的解决办法。
作者 / 振之
网站 / 毅博客 http://andy.andymao.com/
电话 / (86)025 5890 9295