JQuery实现简单的国际象棋棋盘

介于网上没有简单的JQuery的国际象棋棋盘在此写了一个,供大家参考

<!DOCTYPE html>
<html>
	<head lang="en">
		<meta charset="UTF-8">
		<title></title>
		<style>
			* {
				padding: 0;
				margin: 0;
			}

			ul,
			li {
				list-style: none
			}

			li {
				width: 100px;
				height: 100px;
				float: left;
				border: 1px solid black;
				box-sizing: border-box;
			}

			#container {
				width: 300px;
				height: 300px;
				margin: 100px auto;
				border: 2px solid black;
			}
		</style>
		<script src="../../../../jquery-3.6.0.min.js"></script>
	</head>
	<body>

		<div id="container">
			<ul>
				<li></li>
				<li></li>
				<li></li>
			</ul>
			<ul>
				<li></li>
				<li></li>
				<li></li>
			</ul>
			<ul>
				<li></li>
				<li></li>
				<li></li>
			</ul>
		</div>
		<script>
			$("#container>ul").children("li:even").css("background", "black");
			
		</script>
	</body>
</html>

效果如图
JQuery实现简单的国际象棋棋盘

上一篇:2-3 树/红黑树(red-black tree)


下一篇:graphviz 的使用教程