今天完成的事情：

1、编写九宫格页面，基本完成 task1，可以访问页面，如图：

2、继续学习 html 基础知识

3、学习了盒子模型，了解 Margin 属性

4、了解了一些 viewport 相关知识

明天计划的事情：

1、完善九宫格页面，有可能进行 task2

2、继续学习 html、css 基础知识

3、使用WebStorm上传代码到github

遇到的问题：

使用 viewport 属性后，在手机端访问九宫格页面时出现问题，显示成一竖排，然后就搜索了一下 viewport 方面的相关知识。起初每个格都是设置具体的 height 和 width 值，改成外层包裹一层具体宽高的 <div>，每个小格尺寸使用 % 尺寸。

九宫格还未居中显示，基础知识还没看到居中显示，后面会改进居中显示。

收获：

了解了一些 viewport 知识，viewport 起源于苹果，现在已被大多数浏览器支持，默认情况下，手机浏览器会像在大屏幕的桌面浏览器那样显示你的页面，宽度达到了980 px，然后缩小内容以适应手机的小屏幕，用户在手机看这个页面时感觉字体就比较小，也比较模糊，必须放大才能看清；定义 viewport meta 标签，他的作用是创建一个虚拟的窗口，通知浏览器使用设备的宽度作为可视区的宽度。

<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum=1.0, user-scalable=no">

其中： width-viewport 的宽度 height-viewport 的高度

initial-scale：初始的缩放比例

minimum-scale：允许用户缩放到的最小比例

maximum-scale：允许用户缩放到的最大比例

user-scalable：用户是否可以手动缩放