jquery - 带包装的 Bootstrap 列

Question

我需要这样的布局:

1. 响应式设计(基于 Bootstrap 3)
2. col-sm-7(紫色)具有固定高度，但可选
3. col-sm-5(蓝色)具有可变高度(非动态)，可选
4. 底部文本(绿色)应包裹紫色和蓝色 block 并采用全宽(col-sm-12)
5. block 可以根据其他 block 的存在进行额外分类
6. 在移动 View 中，它们应该被放样:

是否可以通过 Bootstrap 标记和CSS来实现此行为？怎么办？

Answer 1

只需将 .pull-left 类添加到蓝色和紫色容器即可。

场景 1:http://jsfiddle.net/xawvez5o/

场景 2:http://jsfiddle.net/xawvez5o/1/

场景 3:http://jsfiddle.net/xawvez5o/2/

场景 4:http://jsfiddle.net/xawvez5o/3/