Css定位元素的层叠现象

Css定位元素的层叠现象
 
给元素添加定位,可能会出现元素的层叠,层叠的顺序一般满足以下规律:
 
父子关系:子元素会层叠在父元素上。
 
非父子关系。
 
元素类型
层叠顺序
都是非定位元素
在标准流中一般不存在层叠现象
 
1个是定位元素,1个是非定位元素
定位元素会层叠在非定位元素上
 
都是定位元素
默认后面的定位元素层叠在前面的定位元素上,使用css属性z-index来控制层叠顺序
 
z-index属性
z-index属性用来设置定位元素的层叠顺序(仅对定位元素有效,非static),取值可以是正整数、负整数、0;
 
比较规则:
 
如果是兄弟关系:z-index越大,层叠在越上面,z-index相等,写在后面的元素层叠在上面;
 
如果不是兄弟关系:各自从元素本身以及祖先元素中,找出最邻近(兄弟关系)的2个定位元素进行比较,而且在2个定位元素必须有设置z-index的具体数值;

如需转载,请注明文章出处和来源网址:http://www.divcss5.com/html/h64640.shtml

张贴在3