3
純粋なHTMLとCSSでチェス盤を終えました。しかし、私はデザイナーではないので、簡単なことをする方法を理解することはできません。私はボードの周りにフレームを作ろうとしています。私はtable.chessboard要素（以下のコード）に余白を作るためにCSS境界プロパティを使用しています。しかし、そのマージンはボード内で拡大し、ボーダーで四角形を減少させます。純粋なhtmlとcssのフレームでチェス盤を描く
これを解決するにはどうすればよいですか？
HTML：
<table class="chessboard">
<tr class="chessboard">
<td class="chessboard"></td>
<!-- line above 8 times -->
</tr>
<tr class="chessboard">
<td class="chessboard"></td>
<!-- line above 8 times -->
</tr>
<tr class="chessboard">
<td class="chessboard"></td>
<!-- line above 8 times -->
</tr>
<tr class="chessboard">
<td class="chessboard"></td>
<!-- line above 8 times -->
</tr>
<tr class="chessboard">
<td class="chessboard"></td>
<!-- line above 8 times -->
</tr>
<tr class="chessboard">
<td class="chessboard"></td>
<!-- line above 8 times -->
</tr>
<tr class="chessboard">
<td class="chessboard"></td>
<!-- line above 8 times -->
</tr>
<tr class="chessboard">
<td class="chessboard"></td>
<!-- line above 8 times -->
</tr>
</table>
CSS：あなたのCSSの
table.chessboard {
margin: 80px auto;
background: #999;
border: 25px solid #333;
}
td.chessboard {
width: 70px; height: 70px;
}
tr.chessboard:nth-child(odd) td.chessboard:nth-child(even),
tr.chessboard:nth-child(even) td.chessboard:nth-child(odd) {
background: white;
}
あなただけの正方形の周りにアウトラインをしたいですか？ – HolyMoly
はい、@ HolyMolyです。 – Caco
誰かが私にそれを打つように見えるが、以下の答えがある、それはちょうど 'border'プロパティーだ – HolyMoly