请你用html帮我写一款简单的国际象棋游戏的实现示例其中玩家操控黑棋游戏规则符合国际象棋的规则。

<html>
<head>
    <style>
        .board {
            width: 400px;
            height: 400px;
            display: grid;
            grid-template-columns: repeat(8, 1fr);
            grid-template-rows: repeat(8, 1fr);
        }
<pre><code>    .cell {
        border: 1px solid black;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    
    .cell.white {
        background-color: #f2f2f2;
    }
    
    .cell.black {
        background-color: #bfbfbf;
    }
    
    .piece {
        width: 80%;
        height: 80%;
        border-radius: 50%;
    }
    
    .piece.black {
        background-color: black;
    }
    
    .piece.white {
        background-color: white;
    }
&lt;/style&gt;
</code></pre>
</head>
<body>
    <div class="board">
        <div class="cell white"></div>
        <div class="cell black"><div class="piece black"></div></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"><div class="piece black"></div></div>
        <div class="cell black"><div class="piece black"></div></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell white"></div>
        <div class="cell black"><div class="piece.white"></div></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell white"></div>
        <div class="cell black"><div class="piece.white"></div></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell black"><div class="piece.white"></div></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell white"></div>
        <div class="cell black"><div class="piece.white"></div></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell white"></div>
        <div class="cell black"><div class="piece.white"></div></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell white"></div>
        <div class="cell black"><div class="piece.white"></div></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell white"></div>
        <div class="cell black"><div class="piece.white"></div></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell white"></div>
        <div class="cell black"><div class="piece.white"></div></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
        <div class="cell black"></div>
        <div class="cell white"></div>
    </div>
</body>
</html