今天完成的事情：

使轮播图自动轮播：

使用Carousel组件搭建轮播图，测试时只有在手动点击一次轮播后才会自动轮播，不然就只显示第一张轮播图。

查找原因，寻找范例，后发现咱们修真院官网首页的轮播图也是这样。翻阅资料，发现各种奇怪的解决方式，但是手动添加很麻烦，最后发现轮播组件里直接就有这个选项：

在最开始的div中添加“data-ride="carousel"”即可实现打开页面就开始轮播。

使用栅格系统完成“简介”“如何学习”“优秀学员展示”与“战略合作企业”的布局，使内容在不同分辨率下分别为四列、两列、单列展示。

遇到的问题：

调试：

在手动拉伸页面宽度时，各栅格会乱飘。

体现在视觉效果上就是并不整齐排列，查找原因，是因为高度是随内容高度自适应的，所以“3”“4”高度不够时“5”“6”就顶上去了。

以前用栅格大部分都是相同高度，以为栅格是自己有一个固定高度的，没想到不是，于是手动设了“height”，问题解决。

一行四列显示使字数多的文字与数字圆不在同一行。

本来以为大家同在一个栅格里，挨个排队站好就是，结果文字一看一行不能全都站下索性就全不站了，自己去另开一行，这我让我很苦恼啊。其实用定位方式也能解决，但是总觉得既然用框架了就应该有一个直接的解决办法，目前存疑，稍后再调整。

学习响应式页面制作要点，与用bootstrap制作响应式：

编写响应式页面大致有三种方法：

1、使用媒体查询

2、使用各种编写好的组件，以bootstrap为例

3、使用flex流式布局

媒体查询是最简单也是最笨的办法，简单是因为逻辑上简单：

响应式不就是在不同页面下要不同的效果么，那我挨个把不同的效果都写出来，然后媒体查询浏览器窗口再调用相应的页面来显示，从逻辑上最好理解；

笨蛋是因为要手写太多代码了，哪怕你写的再熟练毕竟有那么多东西，影响开发效率。

使用组件：

优点是开发高效、便捷，当熟练掌握了某种组件的应用时简直就是看着效果图大概一估算就把框架弄好了，然后一修细节页面就成了；

缺点是第一你用组件就得了解组件的功能吧，越是强大的组件功能越齐全，你要记得的各种组件标签就越多，而且要记得自己写的标签不要跟组件标签名字重复了；第二就是组件毕竟不是量身定制的，页面总是需要额外的修改，对页面精细程度要求越高，你要手动修改的就越多，如果甲方是个处女座，那还是不要用组件，老老实实手写吧

流式布局：

讨厌流式布局，不用。

明天要做的事情：

写页面一footer，调试，初步完成页面二。

遇到的问题：

如上：如何实现就算字数多也要字数跟数字圆在同一行呢，换行你就在那行换嘛，干嘛瞎跑

收获：

看其他师兄代码的时候看到各种稀奇古怪的布局方式，有已经用了栅格组件然手又手写媒体查询改变页面结构的（那干嘛还用组件，囧。。。），有用流式然后css写到300行的（有恒心有毅力）最神奇的是在同一个页面用了栅格组件又用了流式又用浮动，光是看我都理了半小时思路才清楚。

看博客上写响应式布局，既然用组件，就是因为多快好省，少写代码，能用组件已有配件的就不要再自己手动开发，冗余又麻烦，尤其不要相互掺杂，既不美观，视觉效果又超差，除了你自己别人谁也维护不了。

直接“

<div class="col-md-3 col-sm-6 col-xs-12 people "

”浏览器是能识别的，就别再手写了。

页面一争取150行左右搞定。