今天完成的事情：了解了媒体查询，然后了解了bootstrap布局的时候什么时候用xs，sm，md，lg。

明天计划的事情：写任务

遇到的问题： 战略合作企业板块使用col-lg-3会使一张图片溢出来，然后使用col-lg-2的话有无法占满屏幕，后来使用col-lg-2把width设为20%然后铺满屏幕。

收获：媒体查询Media Queries能在不同的条件下使用不同的样式，使页面在不同在终端设备下达到不同的渲染效果。

使用Media Queries必须要使用“@media”开头，然后指定媒体类型（也可以称为设备类型），随后是指定媒体特性（也可以称之为设备特性）。媒体特性的书写方式和样式的书写方式非常相似，主要分为两个部分，第一个部分指的是媒体特性，第二部分为媒体特性所指定的值，而且这两个部分之间使用冒号分隔。

当你想要内容大小随着屏幕大小自动适应的时候就可以使用bootstrap，也就是在pc端以及不同手机（显示屏大小不同）端内容也能够正常显示的时候；

一行最多占十二个标签，不管是大屏还是超小屏的时候；

col-lg一般用于大屏设备（min-width：1200px），col-md一般用于中屏设备（min-width：992px），col-sm一般用于小屏设备（min-width：768px），col-xs用于超小型设备（max-width：768px）；后面跟数字是几，也就是占几份。比如是4，也就是一行可以显示3个；或者12，就是一行可以显示1个；

一般设置的话四个属性都用到会比较好，这样就可以在不同屏幕上很好的展示；

比如你有了12个section标签，你想让他们在不同屏幕大小的时候有不同的展示方式，

大屏时一行显示6个，中屏时一行显示3个，小屏时一行展示2个，超小屏一行展示1个，

禅道：

css-task8

任务开始：6.28

预计结束：7.7

禅道主页：http://task.jnshu.com/zentao/project-task-765.html