1

我对 Bootstrap 中的网格系统有疑问。我似乎工作得很好，但“盒子”之间没有边距。例如，如果我有这个：

<div class="column">

  <div class="span11"> 

  </div>

  <div class="span11">

  </div>

</div>

这很好用。但这之间没有空间。那么我是否分配一个“id”并通过 CSS 代码自己编辑它？这是正确的方法吗？例如：

<div class="column">

  <div id="box_1" class="span11"> 

  </div>

  <div id="box_2" class="span11">

  </div>

</div>

还有一件事，至于边框，颜色，我也这样做吗？

谢谢

4

1 回答 1

1

首先，twitter bootstrap 中没有 .column 但 .row

如果您想要左/右边距，请使用带有 offset1 的 span10

如果您想要顶部/底部边距，请创建一个新的 .row 并应用类似 .show-grid 的类

对于边框和颜色，对通用类使用类，对特定类使用 id。

您可以像这样在 jsFiddle 上创建模型http://jsfiddle.net/baptme/EHutn/ 

<!DOCTYPE html>
<html lang="en">
<head>
<link href="css/bootstrap.css" type="text/css" rel="stylesheet">
<style>
.show-grid {
margin-bottom: 20px;
margin-top: 10px;
}
.show-grid [class*="span"] {
background-color: #EEEEEE;
border-radius: 3px 3px 3px 3px;
line-height: 30px;
min-height: 30px;
text-align: center;
}
</style>
</head>
<body>
<div class="container">
<div class="row show-grid">
<div class="span10 offset1"> 
<p>bla bla bla</p>
</div>
</div>
<div class="row show-grid">
<div class="span10 offset1">
<p>bla bla bla</p>
</div>
</div>
</div>
</body> 
</html>
于 2012-06-07T15:00:07.830 回答