今天完成的事情

  1.开始任务六，下午用四五个钟完成整体效果；

  2.今晚晚上以为可以完成了休息了，没想到还有下拉选框！！然后一晚上都在搞下拉选框啦！

  a.一开始不舍得全部改掉列表头，保留下来的代码非常非常的影响我代码重构（算重构吧！），不仅仅代码很碍眼，而且影响我的逻辑思考！

  b.一开始将三列看成独立你的单元，先改第一个单元，因为原先的代码还在，所以各种折腾，主要是小图标为什么就不能跟文本对齐呢！！为什么呢为什么呢！嗯，小图标折磨我一半的时间......

  c.太麻烦了就全部给删了！重来！之后就略顺利了，很简单的text-align让文本居中，让小图标float right，再稍微改下padding这样可以保证屏幕拉伸时位置都不变！嗯！KO！

  d.之后折腾第二级的列表，位置一开始是左上的，怎么不跟着上级走的，然后给了它们宽度，再居中，嗯，之后给高度，划掉下划线，像样了像样了！！

  e.最后看时间太晚了，就不搞了，今天暂时这样

明天计划的事情

  1.完成任务六；

  2.将下拉选框增添自己满意的样式，比如现在点开没有背景颜色没有边框，我还想要加点阴影！

  3.将列表，下拉选框里面的逻辑搞清楚些；

遇到的问题

  1.哦一开始header的小图标用了定位的absolute，发现表头上面有空间，天哪跟昨天遇到的一样！我慌了！

    然后发现是absolute的问题，它不会关闭原来的空间，呵呵，之前看的理论忘了；然后用了fixed，top~可惜小图标需要在右上，只能left91%；

  2.列表内，需要固定的三个图标，如果是固定用手机设备的话，三个图标做成背景，完美，可惜要拉伸宽度；

    所以只能讲左边的两个图标做成雪碧图，右边另外加上图标；

    如果三个图标做成雪碧图作背景图片，那有什么办法使拉伸宽度而不改变小图标的位置和形状呢？我感觉没有啊不科学- -

  3.做中间滚动的时候，哎我是在中间div里加的滚动，但是呢，滚动条显示在全部屏幕的右边，平时我们玩手机如果上面表头一直保持顶端的位置，多方便啊！所以想要只要列表内的滚动的效果；

    尝试1：让header固定顶端！fixed搞定！

    尝试2：让表头固定header之下！fixed；top0！天啊跟header挤在一起了！

    尝试3：好！top的数据变成header的高度！咦，这样好麻烦啊，让header陪着列表一起顶端算了！然后header和列表和谐地跑进div.top里了，置顶搞定！

    尝试4：咦滚动条还是在全屏幕的边边上!想了想，给列表个高度吧！媒体查询给另外一个高度！

    和谐了~

收获

  1.熟练掌握之前学的最基本操作；

  2.熟悉了最近学的flex属性，这属性太方便，很给力；

  3.学习了下拉选框内容：

    重要逻辑：就像二维数组那样，一个列表（第一级列表），其中单位也是一个列表（第二级列表）；隐藏第二级列表，当需要时显示；

    重要CSS代码如下：

                ul.nav li a{display: block;}（a为超链接标签）

                ul.nav li ul{position: absolute;display: none;}（display：none表示不显示）

                ul.nav li:hover ul{display: block;}（:hover选择器表示当点击此元素时怎么怎么样）

日报用时半个钟，打了一半，在23:56才意识到时间要过啦！天啊- -明天继续

github没更新，那就放下午的代码吧