今天完成的任务：

 任务八首页下半部分的布局。

   1，优秀学员展示部分的布局：

     布局方式：

       栅格布局。把内容分解为二个部分（盒子），图片加姓名设为一个盒子、介绍内容为一个部分。

   给图片加姓名的盒子设置text-align：center使其居中；然后把图片和姓名分开分别设置一个盒子。给图片的盒子设置背景图，并设置图片盒子的边角border-radius，使其形成一个圆，然后使用background-size以及background-position进行调整图片的大小和位置。

   2,战略合作企业部分的布局：

     因为是五个内容显示在同一行内，所以不能使用栅格布局了。于是就设置了五个内容的宽度width：20%；并设置float使其在同一行显示，

       1）背景阴影部分的设置：使用hover伪类并设置背景大小以及颜色{box-shadow:0 0 15px #999；}       

    3，友情链接部分的布局：

       同样因为要实现多个内容显示在同一行内，所以和上述一样设置宽度，使用float。

   之后想了下  多个内容都一样的情况下，是不是可以把几个内容写在一个盒子内凑成能被12整除的盒子数，然后使用栅格进行布局。测试了下，确实有可行性，但是也有缺点，就是栅格布局自带的padding，margin值会影响他们之间的距离。

   4，footer底部部分的布局：

     使用栅格布局分成三个部分，使用盒子嵌套盒子的方法进行编写，基本上没有什么特殊的地方。

遇到的问题：

      1，在给优秀学员部分设置白色背景的时候发现如下图所示情况。

  解决办法：嵌套一个盒子包裹整个内容，并设置padding值撑开盒子或者直接设置padding上线边距值。（直接设定padding值比较麻烦）

（解决前）（解决后）

    2，战略合作企业部分布局的时候，遇到如下图所示问题，因为使用浮动的问题，text-align:center,以及margin：0 auto 都不能使其居中。

      解决方法：暂为解决

收获：

  更加熟练的运用bootstrap进行布局，熟练使用hover伪类的用法，以及了解到了设置阴影方面的知识。

明天的计划：

 调整任务七的代码，使其更加规范，之后开始编写任务八第二个页面。