index2.html（position:relative+z-index 上下層）

3-4 index2.html（position:relative+z-index 上下層）

<!DOCTYPE html>
<html lang="zh-TW">
  <head>
    <meta charset="utf-8">
    <title>position 練習</title>
    <style type="text/css">
    #a {
      width:100px;
      height:100px;
      border:1px solid #000;
      background: yellow;
      text-align:center;
      line-height: 100px;
      position: relative;
      z-index: 1;
    }

    #b {
      width:100px;
      height:100px;
      color:white;
      border:1px solid #000;
      background: blue;
      text-align:center;
      line-height: 100px;
      position: relative;
      top:-50px;
      left:50px;
      z-index: 0;
    }

    #c {
      width:100px;
      height:100px;
      color:white;
      border:1px solid #000;
      background: green;
      text-align:center;
      line-height: 100px;
      position: relative;
      top:-70px;
      left:20px;
      z-index: 7;
    }
    </style>

  </head>

  <body>
    <div id="a">
      aaaaa
    </div>

    <div id="b">
      bbbbb
    </div>

    <div id="c">
      cccccc
    </div>
  </body>
</html>

3-3 index2.html（position:relative）