检索或设置对象的层叠顺序。
较大
number 值的对象会覆盖在较小
number 值的对象之上。如两个绝对定位对象的此属性具有同样的
number 值，那么将依据它们在HTML文档中声明的顺序层叠。对于未指定此属性的绝对定位对象，此属性的
number 值为正数的对象会在其之上，而
number 值为负数的对象在其之下。设置参数为
null 可以移除此属性。
此属性仅仅作用于
position 属性值为
relative 或
absolute 的对象。
这个属性不会作用于窗口控件，如
select 对象。
在IE5.5+中，
iframe 对象开始支持此属性。而在之前的浏览器版本中，
iframe 对象是窗口控件，会忽略此属性。此属性对于
currentStyle 对象而言是只读的。对于其他对象而言是可读写的。
对应的脚本特性为
zIndex 。
一下是 实例代码
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus庐">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<title>z-index</title>
<style>
#idParentDiv
{
width: 100%;
height: 120px;
padding: 6px;
background-color: buttonshadow;
position: relative;
}
#idDiv1
{
width: 160px;
height: 80px;
background-color: #FFD700;
padding: 6px;
position: absolute;
z-index: 3;
left: 9px;
top: 9px;
z-index: 6;
}
#idDiv2
{
width: 120px;
height: 80px;
background-color: thistle;
padding: 6px;
position: absolute;
z-index: 3;
right: 9px;
bottom: 9px;
z-index: 4;
}
#idDiv3
{
width: 140px;
height: 80px;
background-color: red;
padding: 6px;
position: absolute;
z-index: 3;
left: 150px;
top: 25px;
z-index: 6;
}
/*#idCodeDiv
{
width: 100%;
padding: 4px;
font-family: verdana, tahoma;
margin: 12px 0px 0px 0px;
background-color: #EEEEEE;
font-weight: bold;
}*/
</style>
</head>
<body>
<div id=idParentDiv>
<div id="idDiv1">
<img src="images/rdl_body3.jpg" style="border:1px solid #FFFFFF;">
<br>
z-index : 6 ;
</div>
<div id="idDiv2">
<img src="images/rdl_body1.jpg" style="border:1px solid #FFFFFF;">
<br>
z-index : 4 ;
</div>
<div id="idDiv3">
<img src="images/rdl_body2.jpg" style="border:1px solid #FFFFFF;">
<br>
z-index : 5 ;
</div>
</div>
</body>
</html>
