今天完成的事情：

任务9的细节修复，修改变更各处代码，任务8和9需要学习的东西比想象的多。

一整天都在修复代码，设定媒体查询各个屏幕大小的响应式，重写各处不同大小的表现方式，看了师兄的代码后，思路开阔了不少。

以下为今天了解的：

弹性盒子的flex-derection：column设定垂直排列，一直以为只是垂直排列，看了师兄的代码，设定了高度后，竟然达到了对齐排列的效果，没能想到这一点。

flex-flow属性flex-flow 属性是 flex-direction 和 flex-wrap 属性的复合属性，用于设置或检索弹性盒模型对象的子元素排列方式

语法：flex-flow:row-reverse wrap;

可以很便捷设定排列和换行，但是元素非flex盒子该属性无效。

明天计划的事情：

任务十可以开始了。

遇到的问题和收获：

设置这一部分。设置的是无序列表，在设定下划线的时候 效果是这样的，搜索一番后，无法单独改变下划线的颜色，下划线的颜色是跟随字体颜色的，只能使用border-bottom来写。后来发现居然有•这个符号。。圆点还是写出来的，后面改用符号方便了些。

栅格的col过分依赖的话在响应式布局时会出现一些意想不到的情况，有时候也不好调控。

在设置虽然设置了弹性盒子的换行flex-wrap:wrap由于连续的英文不换行缩小时英文溢出框外。

搜索到影响文字换行的样式：word-break属性来进行文字的换行。

遇到一个常识性错误，隐藏元素绝对定位忘了把父级进行相对定位，导致宽度被拉长过多超出100%宽度。

设定盒子的最小宽度min-width可以使宽度不足时换行，设定在栅格的col属性行上挺好用。

a标签设定子级元素p，p设置了样式为inline-block元素，导致A标签的hover属性无法体现出来。