js别踩白块小游戏(一)--网页版

一、整体思路

1、创建基本的静态页面;

2、让div动起来

3、动态创建Div

4、动起来后,填补缺失的div

5、随机创建黑块

6、绑定点击事件

7、点击判断输赢

8、游戏结束后的限制处理

9、色彩块触底的处理

10、加分

 

二、需要的文件

1、用css写的文件:strly.css

2、用js 写的文件:main.js

3、用html写的文件:index.html

 

三、strly.css(CSS) 描述了网页的布局,描述了游戏的布局

 1、设置格子的外边距、宽、高、边框粗细

js别踩白块小游戏(一)--网页版

2、设置内容区域的大小

js别踩白块小游戏(一)--网页版

3、设置内容区域里面的go区域 

 js别踩白块小游戏(一)--网页版

4、内容区域里面的游戏区域 

js别踩白块小游戏(一)--网页版

5、设置游戏区域的每一行的高度 

js别踩白块小游戏(一)--网页版

6、 设置游戏区域的行里面的每一个格子 

js别踩白块小游戏(一)--网页版

7、设置计数区域 

js别踩白块小游戏(一)--网页版