今天完成的事情：（一定要写非常细致的内容，比如说学会了盒子模型，了解了Margin） 

1、完成了职业页面主体的编写。

写这个页面有点想起在做任务七的感觉了，只要能写出一个div，后面的就相对要简单些，其实写出来感觉还好，就是在写的时候会遇到一些问题，就要花时间在网页中调试找问题，然后再解决。

这次基本上都是用栅格和flex来写，就比任务七写起来要快一点，没有了绝对定位去调试top/right/bttom/left的值感觉很好。但是感觉不用position后都有点生疏了，所以在写触发hover效果的时候还在想怎么能把这个div的内容弄上去再用display：none隐藏，给最大的父级类名设置hover选择器触发。写这个地方想了下，因为前面都是简单的hover效果，这次涉及到内容还要设宽高相当于重新写一个内容少一点的div，两个并列的div怎么让它覆盖到另一个上，所以这里就要用到绝对定位来实现，让div脱离文档流，在用top值来调让div到另一个要覆盖的div的相同位置。

html代码：

css代码：

这里用到的都是前面任务学的知识点，我一般都是先把宽高值随便设，然后再去网页里调试，因为背景是要透明化，所以方便好看调试我就先把需要用到的属性写上去，然后在网页上看效果，不需要的删掉，需要的调试数值。

问题是这个属性设置好后怎么去设置hover，知道给谁设，但是不知道该设什么属性，后来想不通，就去看了下师兄的代码，发现是直接设置display：block就可以了。我有点不太理解为什么设置这个就可以显示了。

今天写的难点是在与div里每一个都是单独的，类似于表格那种，只能每一个都用div来单独写设置border边框属性。div多了就会有点晕，一层一层的嵌套就会出现下面在遇到的问题中的情况。

2、

学习了一个新属性：

明天计划的事情：（一定要写非常细致的内容） 

完成职业的底部编写。再开始第三个页面的编写。

遇到的问题：（遇到什么困难，怎么解决的）

1、 

  给最大的div设置flex就可以了。

3、

我的第二个页面当小于768px值的时候，会变成下图的样子：

因为栅格最小的是sm，但是只能在768px以上，以下就需要用到媒体查询，这里我先放放，先写第三个页面后在调整。

收获：（通过今天的学习，学到了什么知识）

可以用div+border来写表格。hover效果的样式也可以很丰富。