<!DOCTYPE html>
<html>
<head>
<title>五子棋游戏</title>
<style type="text/css">
.board {
display: flex;
flex-wrap: wrap;
width: 400px;
height: 400px;
margin: 0 auto;
border: 1px solid black;
background-color: #f5f5f5;
}
.square {
box-sizing: border-box;
width: 20%;
height: 20%;
border: 1px solid #ccc;
text-align: center;
font-size: 50px;
line-height: 120px;
cursor: pointer;
}
.square:hover {
background-color: #e6e6e6;
}
.black {
color: black;
}
.white {
color: white;
background-color: black;
}
.message {
text-align: center;
font-size: 30px;
margin-top: 20px;
color: #008CBA;
}