1

我试图在引导程序 3 中实现这种效果:http: //i.stack.imgur.com/BZRRC.png

Bootstrap 默认使用 12 列。如果当前行中的所有列宽加起来超过 12,则溢出的列将在“下一行”的下方结束。

div现在看起来像这样:

<div class="row">
  <div class="col-md-4">
     ...[left window]
  </div>
  <div class="col-md-6 col-md-pull-1">
     ...[middle, bigger window]
  </div>
  <div class="col-md-4 col-md-pull-2">
     ...[right window]
  </div>
</div>

这是 14 列。中间窗口正确地与左侧窗口重叠。但右侧窗口最终位于左侧窗口下方,但左侧有两列。

有没有办法防止这种行为并将所有 col-md-* 保持在同一行,即使有超过 12 个(在这种情况下为 14 个)?

4

2 回答 2

1

很确定没有办法在一行中获得超过 12 列/跨度。但是,您可以在列内创建行以访问更多列,例如:

<div class="row">
  <div class="col-md-6">
     <div class="row">
          //12 columns here
     </div>
  </div>
  <div class="col-md-6">
     <div class="row">
          //12 columns here
     </div>
  </div>
</div>

这样他们仍然在“一”行。不确定它是否对您的效果有效。

于 2013-10-24T11:10:21.490 回答
0

据我所知,你不能用引导程序开箱即用。相反,在最后一列中使用一个类并添加一个负边距。

这是您的 HTML 和 bootstrap3 的示例: http: //cdpn.io/bAKfj

于 2013-10-24T11:08:32.620 回答