z-index 失效
在做的全过程中,发现了1个很简易却又许多人应当碰到的难题,设定Z-INDEX特性失效。在CSS中,只能根据编码更改等级,这个特性便是z-index,要让z-index起功效有个小小的前提条件,便是元素的position特性如果relative,absolute或是fixed。
1.第1种状况(z-index不管设定多高都不起功效状况):
这类状况产生的标准有3个:
1、父标识 position特性为relative;
2、难题标识无position特性(不包含static);
3、难题标识含有波动(float)特性。
eg:z-index等级不起功效,波动会让z-index无效,编码以下:
处理方法有3个(任1便可):
1、position:relative改成position:absolute;
2、波动元素加上position特性(如relative,absolute等);
3、除去波动。
2.第2种状况
IE6下,等级的主要表现有时并不是看子标识的z-index多高,而要看全部DOM tree(连接点树)的第1个relative特性的父标识的等级。
eg:IE7与IE6拥有一样的bug,缘故很简易,尽管照片所属div当今的老爸等级很高(1000),可是因为老爸的老爸不管用,可伶了9999这般强势的孩子沒有左右之日啊!,编码以下:
处理方法: 在第1个relative特性再加1个更高的等级(z-index:1),编码以下: