前端技术搭建俄罗斯方块（内含源码）

The sand accumulates to form a pagoda

• ✨ 写在前面
• ✨ 功能介绍
• ✨ 页面搭建
• ✨ 样式设置
• ✨ 逻辑部分

✨ 写在前面

上周我们实通过前端基础实现了扫雷游戏，今天还是继续按照我们原定的节奏来带领大家完成俄罗斯方块游戏，功能也比较简单简单，也是想借助这样一个简单的功能，然后来帮助大家了解我们JavaScript在前端中的作用， 在前面的文章当中我们也提及到我们在本系列的专栏是循序渐进从简单到复杂的过程，后续会带领大家用前端实现翻卡片、贪吃蛇、井字游戏、拼图、连连看扫雷等有趣的小游戏，纯前端语言实现，都会陆续带给大家。欢迎大家订阅我们这份前端小游戏的专栏。订阅链接：https://blog.csdn.net/jhxl_/category_12261013.html

✨ 功能介绍

游戏开始时，会出现一个空的游戏区域，以及一个正在下落的方块（俄罗斯方块）。使用方向键控制方块的移动和旋转，目标是将方块填满游戏区域的水平行，使其消除。消除水平行的方式是将一整行填满方块，当一行被填满时，该行将被清除并获得得分。游戏结束条件是当方块堆叠到游戏区域的顶部时无法继续移动。（为大家尝试了一波，嗯。。。请不要嘲笑我?，哈哈大家可以尝试下，我在这方面实在是。。。。）

游戏区域是一个矩形，由一系列格子组成。初始状态下，游戏区域是空的。方块由四个小方块组成，可以是不同的形状，每个小方块