如何在自举行中获取井，在它之间留出空间

Question

我正在使用引导程序，试图让两个wells连续不被压扁，但是遇到了麻烦。 这是我的代码：

<div class="container"> 
  <div class="row">
     <div class="col-sm-4 well"> first column</div>
     <div class="col-sm-4 well"> second column</div> 
  </div>
</div>

我正在按照我已经完成的代码编写的教程，但他们的网页加载了井之间的空格。 任何人都可以建议如何让他们在行之间有空格？ 感谢。

Answer 1

根据bootstrap docs

  

使用井作为元素的简单效果，为其添加插图   效果。

所以不要将它们与col-*-*一起使用，以达到您想要的效果，可以将它们用作col-*-*的孩子

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" />
<div class="container">
  <div class="row">
    <div class="col-xs-4">
      <div class="well">first column</div>
    </div>
    <div class="col-xs-4">
      <div class="well">second column</div>
    </div>
  </div>
</div>

信息：

默认well：

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>
<div class="container">
  <div class="row">
    <div class="well">first column</div>
    <div class="well">second column</div>
  </div>
</div>

另外，你有可选的课程：

  

使用两个可选修改器控制填充和圆角   类。

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>
<div class="container">
  <div class="row">
    <div class="well well-sm">first column</div>
    <div class="well well-lg">second column</div>
  </div>
</div>