<html>
<head>
<title>Chess</title>
<style>
body {
  background-color: #f8f8f8;
  font-family: 'Arial', sans-serif;
  margin: 0;
  padding: 0;
}
<p>.board {
display: flex;
flex-wrap: wrap;
width: 800px;
height: 800px;
margin: 0 auto;
border: 5px solid #444;
background-color: #f8f8f8;
}</p>
<p>.square {
width: 100px;
height: 100px;
background-color: #fff;
border: 1px solid #444;
}</p>
<p>.piece {
width: 50px;
height: 50px;
background-color: #ccc;
border-radius: 50%;
border: 1px solid #444;
position: relative;
top: 25px;
left: 25px;
}</p>
<p>.black {
background-color: #444;
}</p>
<p>.white {
background-color: #ddd;
}
</style></p>
</head>
<body>
<div class='board'>
  <div class='square'>
    <div class='piece white'></div>
  </div>
  <div class='square'>
    <div class='piece black'></div>
  </div>
  <div class='square'>
    <div class='piece white'></div>
  </div>
  <!-- And so on... -->
</div>
</body>
</html>
Play Chess Online: Free HTML Chess Game

原文地址: https://www.cveoy.top/t/topic/lnji 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录