今天完成的事情：

完成task7第一个页面，将头部底部等能共用部分的样式剥离出来写在同一份样式表中（页面还需要微调），阴影和鼠标hover效果还没调好。

明天计划的事情：

完成任务7的两个页面。

遇到的问题：

Q1：关于图片的垂直居中？

A1：图片上层元素样式设置为font-size: 0;line-height和height相同，display: inline-block;

    图片使用样式vertical-align: middle;就可以实现图片居中。

参考资料：

大小不固定的图片、多行文字的水平垂直居中 

http://www.zhangxinxu.com/wordpress/2009/08/大小不固定的图片、多行文字的水平垂直居中/

Q2：关于css属性在多层嵌套中的继承。

A2：div-h2、ul-li-h3、img、p 居中样式，只需要在最外层div设置text-align: center;，

元素的display属性有inline就可以水平居中。

Q3：ul的li文字和前面的点距离过远。

A3：先消除ul和li的格式，然后用图片或者<span>标签(使用border-radius画圆）代替小圆点。

Q4：如何设置阴影效果，如何区分边框和阴影

A4：A盒子内有个B盒子和C盒子，B盒子的border-show 阴影不算在width里面，

    B盒子的阴影可以覆盖C盒，也能超过B的外层盒子A盒子，但是如果A盒子

    设置了overflow:hidden样式，多出来的阴影会被剪切掉。遇到此种状况，

    是删除overflow:hidden使得阴影展现？还是重新计算宽高使得阴影能够合理展现？

收获：

关于布局感觉是个十分大的坑，CSS中各个层级见样式的继承和影响感觉还不是那么的顺，特别是对于精细还原PSD的设计，元素是占据weight和height、还是仅占据实际空间？还需要仔细的理理。

PS：服务器上不去。。 今天又没得成果展示了。