今天完成的任务

a.任务5的1-5步骤完成（header-main-footer)的布置

b.6.1-6.6的日报回顾

c.拓展知识的学习

d.开始给代码附带上注释。

明天的计划

a.继续任务5的进行

b.6.7-6.10的日报回顾

c.拓展知识

遇到的问题：

a.header好像实际height要小一点，设置的50px;下面main的margin设置也是50px;但是会显示出一点点的蓝色背景（body背景是#fff,显示也应该是白色)有点没弄懂

b.background-ima的设置弄成效果，后来使用了background-size设置大小，然后定位了ima位置弄成理想效果

收获

nth-of-type() 选择器：规定属于其父元素的第（）个 元素的每个 元素格式(这个东西也好用）

BFC的概念。

BFC(Block formatting context)直译为"块级格式化上下文"。

浮动元素和绝对定位元素，非块级盒子的块级容器（例如 inline-blocks, table-cells, 和 table-captions），以及overflow值不为“visiable”的块级盒子，都会为他们的内容创建新的BFC（块级格式上下文）。

在BFC中，盒子从顶端开始垂直地一个接一个地排列，两个盒子之间的垂直的间隙是由他们的margin 值所决定的。在一个BFC中，两个相邻的块级盒子的垂直外边距会产生折叠。

在BFC中，每一个盒子的左外边缘（margin-left）会触碰到容器的左边缘(border-left)（对于从右到左的格式来说，则触碰到右边缘）。

display:flex;的初步尝试使用（感觉确实很方便，仅仅使用了align-items：center，就完成了很棘手的图片垂直居中效果省去了很多操作）后面要开始逐步多使用它设计布局了。

语义化

语义化是前端开发里面的一个专用术语，其优点在于标签语义化有助于构架良好的html结构，有利于搜索引擎的建立索引、抓取；另外，亦有利于页面在不同的设备上显示尽可能相同；此外，亦有利于构建清晰的机构，有利于团队的开发、维护。

From wikipedia

语义化是指用合理HTML标记以及其特有的属性去格式化文档内容。通俗地讲,语义化就是对数据和信息进行处理,使得机器可以理解.

语义化的(X)HTML文档有助于提升你的网站对访客的易用性，比如使用PDA、文字浏览器以及残障人士将从中受益。对于搜索引擎或者爬虫软件来说，则有助于它们建立索引，并可能给予一个较高的权值。

事实上SEO最有效的一种办法，就是对网页的HTML结构进行重构，实质上就是语义化。（开始慢慢使用语义化，不知道用的对不对，忐忑)

总结：革命尚未成功，同志还需努力，前几天学习了display的基础知识，还没有成为自己的，可以拿来布局使用，后面计划要把它慢慢消化成为我的东西（因为确实感觉好方便).还有就是框架制作，现在制作页面，虽然有了个样本和大概想法，但是想要达成完美效果，还的不断实验修改，不知道自己什么时候能达到一次数值就能达到完美效果的境界。师兄最近忙完了，让他好好休息2天，然后继续开始没日没夜骚扰了为了学习！