今天完成的事：

●安装并配置vscode软件

  逐渐熟悉工具并会使用插件 如 live server 和 open in browser

●初步完成任务一的代码编写

●初步会使用chrome开发者模式

●利用空闲时间通过教学视频了解git及github

明天计划的事情：

●优化微调任务一代码及参数

●学习并配置nginx，通过手机访问

●学习并配置git，将代码保存在github

遇到的问题：

1.使用span页面空白，但加入float属性后，页面正常显示

原因：

span为行级元素，宽度由内容决定（不应设置宽高），加入float属性后span转化为块级元素

解决办法：

用div代替span元素

2.将width和height值都设置为百分比时，方块不成比例拉伸

原因：

width和height属性值为%时，具体数值为父级的%多少，<span class="block">是<div class="grid">的子级，class“grid”的具体大小等于body的大小，body的大小又取决于网页的大小，当页面宽高变化时，calss“block”的30%为页面宽高的30%，所以会出现不等比的拉伸。

解决办法：

background-color的染色范围是content，padding和border，可添加padding-bottom或padding-top属性将背景色包容进去，撑开高度，并将height:0;此时height高度等于padding-bottom或padding-top。

3.border-radius设置为px具体数值时，页面缩小到一定程度九宫格会变为圆

解决办法：

将border-radius设为为%

2. 收获：
3. 了解到自己的基础知识盲区
4. 对工具的使用（vscode及chrome开发者工具）