一、今天完成的事情

1、完成任务7的提交。有点意外，一次过的，可能是在任务7上用的时间比较久。

2、完成任务8，还差友情链接和footer，具体：

a）介绍和人数统计；b）如何学习；c）优秀学员展示；d）战略企业；用bootstrap网格系统布局，考虑响应式。

二、明天计划的事情

1、为优秀学员展示加上轮播图效果

2、战略合作企业加上阴影。

3、完成友情链接和footer。

4、规范自己的代码。

5、完成任务8第二个页面：战略合作企业

三、遇到的问题

1、对于psd上的文字及图片的二维坐标，我是1:1copy下来的，比如说：rocket这张图，上距背景图是163px，距下“高效”是33px，还有的就是左右距离，都是通过测量psd的得到的，现在有个问题，有没这个必要，做的这么精确，还是说自己估一个大概值？

2、当背景图自动轮转的时候，页面的字体和图片位置会跳动，清晰度变模糊，没找出原因。

3、在布置一些小图标的时候，是否需要加宽度么？

这个泽平师兄说，不用，因为不用考虑响应式。

4、对内容和文字的对齐：

a）同一层文字水平对齐：text-align：left/center/right。

b）一个块或者一个层对齐：float:left/right，

c）整个网页对齐使用<center>标签或使用通用的样式body{margin:0px auto;width:*px}

垂直据中

1.单行文本的对齐：如果容器里面就只有一行文字，那对齐就简单很多了，我们可以定一个这样的样式：div {height:20px;line-height:20px;}但是这种方法有一个局限，文字只能是一行，如果有多行的话那这个方法就不适用了，就算是加一个overflow:hidden；也会将我们需要显示的内容隐藏掉。

2、多行未知高度文字的垂直居中：如果需要将多行文字垂直居中对齐，我们可以将这些文字作成一个块，就是在文字两端加一个div，然后对这个DIV加相应的margin或者padding值，使上下的padding值或者margin值相同即可。但是这只是一种“看起来”的垂直居中方式，并不是真正意义上的居中。同时如果内容发生变化那这些值都需要去做改变，不是很方便。代码片段：div {padding:20px; }，总体来说这种方法的优点就是它可以在任何浏览器上运行，并且代码很简单，只不过这种方法应用的前提就是容器的高度必须是可伸缩的。最大的问题是层的宽和高的变化有可能影响整个网页的布局，需要仔细考虑。

3、多行文本固定高度的居中：我们知道css中的vertical-align属性只会对拥有valign特性的(X)html标签起作用，例如表格，但是div毕竟不是表格，有没有什么方法可以让DIV变成表格的显示方式呢？在CSS中还有一个display属性能够模拟<table>，所以我们可以使用这个属性来让<div>模拟<table>就可以使用vertical-align了。注意，display:table和display:table-cell的使用方法，前者必须设置在父元素上，后者必须设置在子元素上，因此我们要为需要定位的文本再增加一个<div>元素：

css代码片段：

.wrap {

display: table;

height: 300px;

}

.content {

display: table-cell;

width: 550px;

border: 1px solid #fff;

background-color: #ccc;

vertical-align: middle;

}

这个方法应该是很理想了，但是不幸的是IE6并不能正确地理解display:table和display:table-cell，因此这种方法在IE6及以下的版本中是无效的。

四、收获

     做任务8发现，任务量比以前的大，考虑的东西也更多，收获的东西也多：

1、学会简单的响应式的页面布局

2、对于bootstrap框架应用更熟悉。

3、看web开发规范，规范自己的代码。