任务八：响应式网格（栅格化）布局
任务目的
- 使用 HTML 与 CSS 实现类似 BootStrap 的响应式 12 栏网格布局，根据屏幕宽度，元素占的栏数不同。
任务描述
- 需要实现如 效果图 所示，调整浏览器宽度查看响应式效果，效果图中的红色的文字是说明，不需要写在 HTML 中。
详细任务要求请点击百度前端查看
感想
任务八是刚刚好自己简单的学习了下Bootstrap的相关知识，但是其实对于栅格系统并没有去深入了解它的原理，而这里刚好有了相关的任务要求，也就顺理成章的需要去了解下了，其实自己也没想到这个任务会涉及到Bootstrap的，不过其实自己做下来，还是出现了很多疑问，虽然任务要求看上去很简单，但是我也是查了些资料才做出了这个任务，比如说
[class*='col-'] {...}
这个样式的运用，我就是自己百度了下才了解到了相关运用方法的。
下面是练习的演示和代码
Demo：
百度前端任务八