今天完成的事情，任务8首页已写完。本来计划今天把小课堂准备好的，结果在友情链接上面耽误了不少时间。

遇到的问题，

友情链接部分，用栅格系统分为10列，每一列要占1，但是分完之后，布局就直接崩坏了。在这个问题上浪费了很多时间，开始以为是我的布局啊，css属性上面写错啦，结果就是越写越不对劲。bootstrap框架的栅格系统的列带有一定的自适应能力。但是有感觉很奇怪，

我们要分10项目，我们不一定非要每一列等于1去分布，我们只写col-lg屏幕尺寸就好了，bootstrap的列可以自动布局，但是跟之前师兄的说得方法有很大的差异。

而且10个项目每个项目给它1的情况下，也不知道为什么布局会被崩掉。就感觉很奇怪。

自动布局列

利用栅格断点特性进行排版，可以简化列的大小，而不需要批定显式的列宽，如强制写为：.col-sm-6。

今天的收获，认真看了一下关于bootstrap4的栅格系统。但是关于col列的问题还是感觉，有些不懂，今天尝试了一下用li标签去写布局。和关于栅格布局中的列偏移，与margin移动。

<div class="row">

  <div class="col-md-4">.col-md-4</div>

  <div class="col-md-4 offset-md-4">.col-md-4 .offset-md-4</div>

</div>

盒子本身占据4列空间，offset-md-4移动4列，就会出现在第8列的空间上。

明天计划讲小课堂，任务8第二张图。