今天完成的：

        任务六完成进度70%。

        完成了header、列表头、footer的布局，列表主体部分完成了一部分。下拉框还没进行制作，文字截断的“……”还未完成。

        在写header和列表头的时候，我将这两块放到了一个div里，一起进行了fixed定位；还用到了块元素水平居中，按钮的绝对定位，flex布局（列表头用到了，不过效果不太好，可能会进行修改），背景图片的设置。（对了，在这个任务中，使用了雪碧图，在使用的过程中还遇到了一些问题）

        在写footer的时候，使用了fixed定位父级div，使用了绝对定位（absolute）和transform进行定位按钮，还使用了flex布局设置底部居中，以及背景图片的设置。

        在写列表主体部分的时候，使用了flex布局两端对齐（不过并没有对齐-_-||），以及设置了背景图片（小图标）。

        在进行定位的时候还使用了calc，使用的时候有一点需要注意，在“+”“-”的左右两边记得加空格。“*”“/”最好也加。        

明天计划的：

        查看如何使用css模拟下拉框；关于文本打断的资料；熟悉雪碧图的使用；解决遗留问题（flex两端对齐无效）。

        回顾下前几个任务，写一下深度思考的问题。

遇到的问题：

        在进行footer按钮布局的时候，发现效果展示的布局按钮正好在四等分线上，而且应该是自适应宽度的，flex布局貌似没有合适办法（可能我学的还太浅了，很多还不会），就考虑用百分比来解决；然而有个问题，使用负值margin的话，要知道按钮固定宽度（虽然也能知道），不过还是有点麻烦，就使用了昨天看到的一个办法：transform：translate（xx%，xx%），可以用来移动自身宽度的xx%。

        在使用雪碧图的时候进行背景设置的时候，不能直接像之前用小图标的时候，直接把小图标随便放到一个大的盒子里然后定位，这样雪碧图里其他图标也会显示在盒子里。我想到的解决办法是加一个div，给div设背景，再对div进行定位（不过感觉好麻烦啊，结构也很乱-_-||）。

        footer区的按钮，为了稍微有点交互的感觉，我加了active，不过在测试的时候发现每次点击都会有一个小过渡（？）才能到我设置的状态（大概要按住1s），在pc点的时候没事儿，但是模拟移动端就会出现这个问题。目前还不清楚怎么回事儿。

        列表主体部分，一个比较重要的问题就是flex两端对齐无效，目前还没有解决。

今日收获：

        学习了雪碧图的制作及使用。

        更加熟悉了布局的应用。（flex布局还得好好学学）

        calc很好用。

/* 下面链接是目前的效果。*/