
3D Minecraft 的实现能完全用 CSS 和 HTML 实现,而不需要一行 JavaScript 代码吗?答案是肯定的!
诚然,这个小型克隆版只能在只有 9x9x9 大小的世界中玩积木,但 [Benjamin Aster] 仅使用 CSS 和纯 HTML 就做到了这一点,这本身就是一个了不起的成就。就概念验证而言,这相当巧妙。
该项目包含大约 4 万行 HTML 单选按钮和标签,以及不到 500 行 CSS,实际工作就在这里完成。在X 上的一个简短帖子中,[Benjamin] 解释说,9x9x9 世界中的每个块都借助数以万计的<label>
和<input type="radio">
元素进行定义,这些元素用于跟踪块的类型和外观,而 CSS 则将其用作一种显示过滤器。点击一个块相当于点击一个标签,而更改块类型(“空块”或无块也被视为一种块类型)则会切换用户可见的标签。
3D 视图是通过 CSS 动画实现的,这些动画会对显示内容进行变换。点击控件即可启动或停止动画,从而导致视图切换。它为纯 HTML 和 CSS 带来了许多非同寻常的功能,展现了通过一些突破常规的思维方式可以实现哪些功能。
[Simon Willison]对 CSS-Minecraft 及其工作原理进行了更深入的分析,如果您想仔细查看,代码可以在 GitHub 上查看。
一旦您检查完毕并渴望获得更多智慧,请不要错过COBOL 中的 Minecraft和Minecraft 在… Minecraft 中运行。
原文: https://hackaday.com/2025/06/25/minecraft-clone-manages-with-nothing-but-html-css/