4列1280px，第3列1024像素以下第2列

-2

我刚刚开始使用bootstrap，无法确定如何使中间设备的列出现在另一列的下方。4列1280px，第3列1024像素以下第2列

大型设备

[A] [B] [C] [D]

媒体装置

[A] [B] [D] 
    [C]

小型设备

[A] 
[B] 
[C] 
[D]

理想我想C列B项为媒体装置出现，但不能看到的一种方式这样做。所有列应具有相同的宽度。困惑

嘿，对不起，刚开始阅读文档。我试图把列B和C放在6列div内，但是在全尺寸时它不显示等宽的列，并且不显示b在b下。继承人我目前的布局。

<div class="row"> 
    <div class="col-lg-3 col-md-4 col-sm-12">Column A</div> 
    <div class="col-lg-3 col-md-4 col-sm-12">Column B</div> 
    <div class="col-lg-3 col-md-4 col-sm-12">Column C</div> 
    <div class="col-lg-3 col-md-4 col-sm-12">Column D</div> 
</div>

来源

2014-11-04 nickand

你忘了，包括你已经尝试过什么，以及为什么它不工作或者是什么是混淆你。在目前的状态下，您的问题是对代码的请求。 – 2014-11-04 19:03:29

我已经添加了我迄今为止所尝试的，对不起，我只是刚刚开始学习引导。 – nickand 2014-11-04 19:34:54

您似乎需要继续阅读文档，因为这不是网格系统的工作原理。查看[他们的例子]（http://getbootstrap.com/css/#grid），然后在一个像JSFiddle（http://jsfiddle.net）或[Bootply]（http：// bootply.com）。 – 2014-11-04 19:37:40

-3

它很容易。随着Bootstrap 3，你从最小到最大。所以默认应该是你的第三种情况了。我不记得默认的xs断点是为宽度，但如果在500以下，你仍然没有得到单列只是添加类.col-sm-12 A-D。

然后添加.col-md-4以获得您的媒介案例。您可能需要添加.col-md-offset-4到[D]以获得您想要的定位。

最后给每个A-d类.col-lg-3

应该这样做：

<div class="row"> 
    <div class="col-md-3">Column A</div> 
    <div class="col-md-6 row"> 
     <div class="col-md-12 col-lg-6">Column B</div> 
     <div class="col-md-12 col-lg-6">Column C</div> 
    </div> 
    <div class="col-md-3">Column D</div> 
</div>

来源

2014-11-04 19:13:54 Phatjam98

不需要从内存中取出，断点位于[doc]（http://getbootstrap.com/css/#grid） – 2014-11-04 19:20:22

LOL我是如何得到downvoted的？ – Phatjam98 2014-11-04 19:33:28

我因为你的例子[不起作用]（http://jsfiddle.net/2Lcx5d1y/）而降低了你的解释并且没有道理。 – 2014-11-04 19:39:40

4列1280px，第3列1024像素以下第2列

回答

相关问题