引导列赢得'；不管我怎么做，都不能在它们之间创建空格，这是我的html结构吗？

我已经搜索了几乎所有关于引导列间距的问题，但似乎都不起作用。我认为这可能是一个简单的新手错误，我的html/css的结构，但我似乎无法理解

我以前使用过很多次引导，但是使用了一个主题，这是我第一次只使用一个简单的引导navbar模板，里面没有其他东西

.img容器{
位置：相对位置；
显示：内联块；
}
.img容器。覆盖{
位置：绝对位置；
排名：0；
左：0；
宽度：100%；
身高：100%；
背景色：rgba（0,0,0,0.1）；
}
.img容器：悬停.overlay{
显示：块；
背景色：rgba（0,0,0,0.6）；
}
.img container.overlay.services标题{
颜色：#fff；
字体大小：100px；
位置：绝对位置；
最高：25%；
左：20%；
}

商店
商店
商店

添加引导

col md offset-*

类以实现列之间的间距

<div class="col-md-4 col-md-offset-1">  

---

上面的代码将创建一个1列大小的间隙。

您可以尝试

填充

，将测试类放在每个

.测试{
垫底：10px；
}
商店

您可以添加一个名为img responsive的类。它将使图像响应

  <div class="col-md-4">                    
    <div class="img-container">
      <img src="images/services/shop.jpg" class="img-responsive" alt="...">
      <div class="overlay">
        <span class="services-caption">Shop</span>                          
      </div>
    </div>
  </div>

商店

.img容器{position:relative；display:inline block；padding left:10px；}为什么不尝试向img容器类添加padding？如果需要空格，则必须将填充添加到图像容器中，零填充和100%宽度意味着它将从最左边的角开始，并扩展到最右边的角。最终发生的情况是，所有列都向右移动，覆盖层落在后面。此外，在列之间没有创建任何可见的空间。我猜这是我为了实现覆盖效果而构建html的方式，但不确定。如果在父元素中包含图像，则会有空间。我所做的就是在这里添加一些图像，并将

max width:100%

添加到img标签中。如果没有一个关于你的问题的合适的工作演示，就很难给你真正的建议。谢谢新手的建议，但我已经试过了。最终的结果是，它将提供太多的间距，并导致列前进到下一行。

  <div class="col-md-4">                    
    <div class="img-container">
      <img src="images/services/shop.jpg" class="img-responsive" alt="...">
      <div class="overlay">
        <span class="services-caption">Shop</span>                          
      </div>
    </div>
  </div>