<!DOCTYPE html>
<html lang="en">
<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">
<title>井子棋游戏--人机对战</title>
<link rel="stylesheet" href="./style.css">
<link href="https://cdn.bootcdn.net/ajax/libs/font-awesome/5.10.0-10/css/all.min.css" rel="stylesheet">
</head>
<body>
<!-- 选择界面 -->
<div class="select-box">
<header>井子棋游戏</header>
<div class="content">
<div class="title">请选择样式</div>
<div class="options">
<button class="playerX">Player ( X )</button>
<button class="playerO">Player ( O )</button>
</div>
</div>
</div>
<!-- 游戏界面 -->
<div class="play-board">
<div class="details">
<div class="players">
<span class="Xtrun">X's Turn</span>
<span class="Otrun">O's Turn</span>
<div class="slider"></div>
</div>
</div>
<div class="play-area">
<section>
<span class="box1"></span>
<span class="box2"></span>
<span class="box3"></span>
</section>
<section>
<span class="box4"></span>
<span class="box5"></span>
<span class="box6"></span>
</section>
<section>
<span class="box7"></span>
<span class="box8"></span>
<span class="box9"></span>
</section>
</div>
</div>
<!-- 结束界面 -->
<div class="result-box">
<div class="win-text"></div>
<div class="btn">
<button>重新开始</button>
</div>
</div>
<script src="./script.js"></script>
</body>
</html>
