<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="GDL.css">
<script src="GDL.js"></script>
<title>限定じゃんけん</title>
</head>
<body>
<div class="main">
<div class="honbun">
<div><h1>限定じゃんけん</h1></div>
<div><h2>ルール説明</h2></div>
<div><h3>9枚のカードがかかれたカードがランダムで配布されそのカードでじゃんけんをし、勝ち点だけてんすうがもらえる</h3></div>
<p><button id="start">start</button></p>
<p><button id="reset">reset</button></p>
<hr>
<h2>残りのカード</h2>
<div class="waku">
<div class="zyanken" ><img src="" width="160px" height="90px" id="0"></div>
<div class="zyanken" ><img src="" width="160px" height="90px" id="1"></div>
<div class="zyanken" ><img src="" width="160px" height="90px" id="2"></div>
</div>
<div class="waku">
<div class="zyanken" ><img src="" width="160px" height="90px" id="3"></div>
<div class="zyanken" ><img src="" width="160px" height="90px" id="4"></div>
<div class="zyanken" ><img src="" width="160px" height="90px" id="5"></div>
</div>
<div class="waku">
<div class="zyanken" ><img src="" width="160px" height="90px" id="6"></div>
<div class="zyanken" ><img src="" width="160px" height="90px" id="7"></div>
<div class="zyanken" ><img src="" width="160px" height="90px" id="8"></div>
</div>
<hr>
<h2>相手のカード</h2>
<div class="waku">
<div class="zyanken" ><img src="" width="160px" height="90px" id="9"></div>
<div class="zyanken" ><img src="" width="160px" height="90px" id="10"></div>
<div class="zyanken" ><img src="" width="160px" height="90px" id="11"></div>
</div>
<hr>
<h2>自分のカード</h2>
<div class="waku">
<div class="zyanken" ><img src="" width="160px" height="90px" id="12"></div>
<div class="zyanken" ><img src="" width="160px" height="90px" id="13"></div>
<div class="zyanken" ><img src="" width="160px" height="90px" id="14"></div>
</div>
<hr>
<div>
<p>勝ち点</p>
<p id="ten">0</p>
</div>
</div>
</div>
</body>
</html>
