引导行未对准容器的右侧

Question

这使我发疯，看起来解决方案很简单，我忽略了它。我有一排三个图像，我的理解是bootstrap负责内容的对齐。

不应该将第三张图像与容器的右侧对齐，并且所有三张图像的间距相等？

http://codepen.io/amits/pen/oxbjmd?editors=1100

<div class="row"> 
<div class="col-md-4"> 
    <img src=""> 
</div> 
<div class="col-md-4"> 
    <img src=""> 
</div> 
<div class="col-md-4"> 
    <img src=""> 
</div> 
</div> 

我缺少什么？

Answer 1

你缺少在img标签.container和.img-responsive，再加上你可以有额外的小型设备.col-sm-*小型设备和.col-xs-*。

添加.col-xs-4仅用于演示

看看在Docs

.container { 
 
    border: red solid 
 
}

<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 col-md-4"> 
 
     <img class="img-responsive" src="//lorempixel.com/1200/900"> 
 
    </div> 
 
    <div class="col-xs-4 col-md-4"> 
 
     <img class="img-responsive" src="//lorempixel.com/1200/900"> 
 
    </div> 
 
    <div class="col-xs-4 col-md-4"> 
 
     <img class="img-responsive" src="//lorempixel.com/1200/900"> 
 
    </div> 
 
    </div> 
 
</div>