我正在参加「码上掘金挑战赛」详情请看：码上掘金挑战赛来了！
前言
上次使用 CSS 画了一只中秋兔子，被吐槽了，这次我们尝试用不一样的形式去重新“画”玉兔，并让它动起来！
码上掘金
效果预览
思路解析
这段代码使用 type = checkbox 的 input 标签 去模拟像素点。
由于需要画的兔子是一个平面，而一维数组只能画线，所以我们使用 二维数组 来存储像素点信息，二维数组的每个元素都是一个对象，每个对象都有 checked 属性用来标记当前的像素点状态。
二维数组的初始数据就是兔子的轮廓。
跳跃是通过一个变量来控制当前是在空中还是在地上，如果是在地上，则每个格子向上移动，这里需要注意的是，我们得从上往上开始赋值，这样才不会将其他状态覆盖，如果是从上往下赋值的话，会覆盖掉原本上一格的像素点信息。同理，从空中落下是从下往下。
这个赋值过程中需要注意，向上跳的话，判断当前如果是非选中状态，则将上面的格子也设置为非选中状态，同时 需要将当前的格子重置为选中状态 。否则下面的格子移上来后会有空白。
结束语
今天的教学到此结束，相信大家已经掌握了本次教学的技巧。希望大家能像兔兔一样天天蹦跶充满活力，中秋快乐~！
