在较小的设备上向上移动列

Question

我有以下布局：

maven.repo.remote=http://www.ibiblio.org/maven,http://www.jutils.com/maven

这很简单，我希望[blurb]为col-md-8，[form]为col-md-4，以便它们在较小的设备上变为全宽。

现在这种情况发生在较小的设备上：

[blurb] (8) [form] (4)

我希望[form]在较小的设备上方[blurb]上面，所以就像这样：

[blurb] (12)
[form] (12)

我无法找出推/拉类来使其正常工作。

非常感谢任何帮助。

Answer 1

首先考虑移动设备，因此如果您想在小型设备上form之前blurb，那么您的HTML应该是这样的。然后在更大的时候使用推拉来改变顺序。

<div class="row">
    <div class="col-sm-8 col-sm-push-4">form</div>
    <div class="col-sm-4 col-sm-pull-8">blurb</div>
</div>