twitter自举网格系统。列之间的间距 [英] twitter bootstrap grid system. Spacing between columns

问题描述

我确定这个问题有一个简单的解决方案。基本上如果我有两列，我可以在它们之间添加一个空格。

Im sure there is a simple solution to this problem. Basically if I have two columns how can i add a space between them.

例如如果html是：

<div class="col-md-6"></div>
<div class="col-md-6"></div>

输出只是两列彼此相邻，占据整个页面宽度。假设宽度设置为 1000px ，那么每个div将是 500px 宽。

The output would simply be two columns right next to each other taking up the whole width of the page. Say the width was set to 1000px then each div would be 500px wide.

如果我想在两个之间有一个 100px 的空间，我该如何实现？显然自动通过引导，div大小会变成 450px ，以补偿空格。

If I wanted a 100px space between the two how could I acheive this? Obviously automatically through bootstrap the div sizes would become 450px each to compensate for the space

推荐答案

您可以使用 col-md-offset - * 类，在这里记录。间距是一致的，以便所有列正确排列。要获得均匀的间距和列大小，我将执行以下操作：

You can achieve spacing between columns using the col-md-offset-* classes, documented here. The spacing is consistent so that all of your columns line up correctly. To get even spacing and column size I would do the following:

<div class="row">
  <div class="col-md-5"></div>
  <div class="col-md-5 col-md-offset-2"></div>
</div>

这篇关于twitter自举网格系统。列之间的间距的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！