2016年10月15日土曜日

(css) ページ内のメニュー表示です(縦メニュー)




ホームページの縦型のメニュー

マウスカーソルの移動により選択が可能です。

ソース

<!DOCTYPE html>
<html>
<head>
<style>
div.relative {
top:500;
    position: relative;
margin:30% auto;
    width: 200px;
    height: 100px;
    border: 3px solid #73AD21;
}

div.absolute {
    position: absolute;
}
</style>
</head>
<body>

  <div class="relative">
    <div style="left:0;position: absolute;"  >uid</div>
    <div style="left:40px;position: absolute;"      >ユーザーID入力域</div>

    <div style="top:50px;left:0;position: absolute;"  >pwd</div>
    <div style="top:50px;left:40px;position: absolute;" >パスワード入力域</div>
  </div>
</body>
</html>

0 件のコメント:

コメントを投稿