z-index属性における表示の違い

z-index: 2
z-index: 1
z-index: 3
z-index: 0

BackPage




HTMLサンプルコード
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_Jis">
<meta http-equiv="Content-Style-Type" content="text/css">
<title>Sample</title>
<style type="text/css">
<!--
div {position:absolute; width: 100px; heght: 50px }
div.test1 {z-index: 2 ; top: 40px; left: 30px; background-color: #fcc }
div.test2 {z-index: 1 ; top: 60px; left: 70px; background-color: #cfc }
div.test3 {z-index: 3 ; top: 50px; left: 120px; background-color: #ccf }
div.test4 {z-index: 0 ; top: 70px; left: 170px; background-color: #ffc }
-->
</style>
</head>

<body>
<div class="test1">z-index: 2</div>
<div class="test2">z-index: 1</div>
<div class="test3">z-index: 3</div>
<div class="test4">z-index: 0</div>
</body>
</html>