今日所做：

1.学习栅格布局的更加具体的内容：使用栅格系统对一行中的div进行布局的时候，

想要调整相邻两个div之间的间隔然后设置了margin，在PC页面的时候看起来还

可以接受，没有什么大问题，但是缩小的手机屏幕时，发现一行中的div在水平方

向上产生了溢出，原因就在于栅格系统的div宽度是默认占满整个视窗宽度的，如

果此时再给div加margin就会导致栅格系统的一行大于视窗宽度导致溢出。

2.针对上面所述问题，有一个解决办法是栅格系统的col-xs-offset-m的功能，可以

让一行中的某个div自动后推m个列的宽度。

3.后来请教师姐，使用栅格系统布局，对具体的div进行设置有什么好的办法，得知

可以在栅格系统自动分出的div中再套上一个div，这样的话对内部的div进行margin、

padding等值的设定也不会影响一行整体的布局。

4.对页面进行整体布局之后，发现压缩宽度，里面div内部的元素会随着宽度的变化而

拉伸，看起来很不美观，然后对元素的宽度进行了百分比设置，但效果还不是很好，

后来发现可以给元素设定一个定值，如果屏幕压缩的程度没那么大，不至于影响到元素

内部的因素，设置一个定值也是无妨的。

明日计划：

1.完成对任务8第三个页面的布局

2.宽度改变时，调整任务8界面的布局

遇到的问题：

使用栅格系统的时候，想要调整一行内div之间的间距，发现会受到很大的限制，宽度不能设定，margin也不能

使用，后来请教师姐，得知可以在div里面再套一个div，用里面的div相对外面的div进行设定，就不会影响栅格中

一行的布局了。