Question

我有拉和推的问题，我认为这是因为与偏移相结合？我想做什么:(由于缺乏声誉，我无法发布图片......） http://i.stack.imgur.com/ypokV.png

在遇到第一个问题并进行搜索后，我发现更好的方法是移动优先（我知道）所以我已经相应地更改了布局。对于较大的浏览器，我需要第二个和第三个单元格来切换它们的位置。

因此，较大屏幕上的第一个单元格总是有2个偏移量，然后是4个大小。另外两个单元格的大小也应该是4，并且在它们切换之后，下一行的那个也应该具有2的偏移量。

我已经尝试了我能想到的所有数字组合，但它无效。请帮助：/我的解决方案之一：

<div class="col-xs-12 col-md-offset-2 col-md-4"></div>
<div class="col-xs-12 col-md-push-6 col-md-4"></div>
<div class="col-xs-12 col-md-4 col-md-pull-6"></div>

Answer 1

不要打扰..忘记拉/推，你不需要它们但你需要首先了解bootstrap网格系统。这是一个例子

<div class="row">
    <div class="col-xs-12 col-md-4 col-md-offset-2"></div>
    <div class="col-xs-12 col-md-4"></div>
    <div class="col-xs-12 col-md-4 col-md-offset-2"></div>
</div>

Answer 2

我相信以下是使用嵌套网格行实现您所需要的：

<div class="row">
    <div class="col-xs-12 col-md-offset-2 col-md-4">
        <div class="row">
            <div class="col-xs-12" style="background-color:gray;">aaaa</div>
        </div>
        <div class="row">
            <div class="col-xs-12" style="background-color:green;">bbbb</div>
        </div>
    </div>
    <div class="col-xs-12 col-md-4" style="background-color:lavender;">cccc</div>
</div>

左边的两个列表都在较大的屏幕上使用偏移2并保留4的大小（右列也是如此）。在较小的屏幕尺寸上，它们都会跳到整行宽度，同时保持所需的顺序。

Bootstrap 3拉动和推动问题

2 个答案: