为什么css中设置z-index不起作用?

很多朋友比较疑惑z-index这个样式。其实只要先知道以下2点就可以很容易的理解了——

 要想给元素设置z-index样式,必须先让它变成定位元素,再通俗一点说,就是要给元素设置一个postion:relative(定位元素:position属性值设置除默认值static以外的元素,包括relative,absolute,fixed。)样式。 

不要给想控制“上、下”的元素设置z-index,而是对他们的父容器设置z-index样式。 

详细介绍

   语法:

z-index : auto | number

参数:

auto :  遵从其父对象的定位

number :  无单位的整数值。可为负数

说明:

检索或设置对象的层叠顺序。

如两个绝对定位对象的此属性具有同样的值,那么将依据它们在HTML文档中声明的顺序层叠

对应的脚本特性为zIndex。

z-index值较大的元素将叠加在z-index值较小的元素之上。对于未指定此属性的定位对象,z-index 值为正数的对象会在其之上,而 z-index 值为负数的对象在其之下。

相关推荐