如何用图像居中一行（顶部/底部）..Bootstrap-3答案

【问题标题】：How to center a row with images(Top/bottom)..Bootstrap-3如何用图像居中一行（顶部/底部）..Bootstrap-3
【发布时间】：2014-03-16 09:21:02
【问题描述】：

我正在尝试对齐 div 行内的图像（具有背景图像）。为了对齐图像（左->右），我将使用偏移量。但现在我的行出现在容器的顶部。现在，如果我将 margin-top 赋予该行，它适用于桌面，但会影响移动/平板电脑的响应能力。有人可以帮我对齐容器内的行吗？

<div class="container">
    <div class="row">
        <img src="images/blueprint.png" class="img-responsive" id="book-img" />
        <div class="col-lg-4 col-md-4 col-sm-4 col-xs-4">
            <img src="images/blueprint_logo1.png" class="img-responsive" />
        </div>
        <div class="col-lg-4 col-md-4 col-sm-4 col-xs-4">
            <img src="images/blueprint_logo2.png" class="img-responsive" />
        </div>
        <div class="col-lg-4 col-md-4 col-sm-4 col-xs-4">
            <img src="images/blueprint_logo3.png" class="img-responsive" />
        </div>
    </div>
</div>

CSS：

#book-img {
    position:absolute;
    background-position:center;
}

http://jsfiddle.net/isherwood/kc3s5/

【问题讨论】：

小提琴已添加。我还添加了一个缺少的结束 div 标签。
我可能需要澄清一下。我不确定你想要达到什么目的。
另外，您的col-sm-4 及以上课程是多余的。他们都默认关注col-xs-4。

标签： twitter-bootstrap twitter-bootstrap-3

【解决方案1】：

如果您要查找的只是容器上的背景，这应该可以：

http://jsfiddle.net/isherwood/kc3s5/4

.container.has-bg {
    background-image: url(http://placehold.it/200x200/990000);
    background-size: cover;
}

【讨论】：