Twitter bootstrap 带折叠的自举响应多列

请帮助我如何使用boostrap 3完成此操作。我附上了三张从桌面拍摄的不同屏幕大小的照片。

我认为您可以创建嵌套列表组，通过更改其宽度，您可以创建响应性设计。使用类似于：

<div class="col-lg-2 col-md-3 col-sm-12 col-xs-12"> ... </div>

。。。

通过这种方式，您可以在大屏幕中同时显示6列，在小屏幕中每行仅显示一列

引导应与“移动优先设计”方法一起使用。所以你必须先根据较小的屏幕设计屏幕，然后再考虑较大的屏幕尺寸

我建议你花些时间在家里

下面是嵌套列表组的几个演示：

---

我希望这能为您提供一个起点。

请向我们展示一些您尝试过的代码。幸运的是，我对bootstrap非常陌生。我不知道从哪里开始。