html - 使用引导程序在图像和 div 之间添加了一个空格

Question

<div class="row">
    <div>
        <img id="image" class="col-md-2" src="img.png">
    </div>
    <div id="otherPart" class="col-md-4">           
    </div>
</div>

我正在使用 Twitter bootstrap 来分隔我的 html 对象，我想让它使我的 id="image" 是动态的并且能够根据图像的大小调整其大小。同时我仍然希望我的图像和“otherPart”之间有间距。我尝试从图像中删除 col-md-2 并在 css 中添加边距，但它没有用。

Answer 1

<div class="row">
    <div class="col-md-2">
        <div class="yourAdditionalMarginClass">
            <img id="image" src="img.png" class="img-responsive">
        </div>
    </div>
    <div class="col-md-4">   
        <div id="otherPart"> ... </div>
    </div>
</div>

图像现在是响应式的，应用了 col 的基本填充，如果您需要更多的填充/边距，请在图像周围包裹另一个 div，给它一个类并将您的样式应用于该类。

Answer 2

试试这个方法

<div class="row">
    <div class=" col-md-2">
        <img id="image" src="img.png">
    </div>
    <div id="otherPart" class="col-md-4">           
    </div>
</div>

Answer 3

从图像中删除col-md-2并将其添加到最外层的 div 中，例如：

<div class="row col-md-2">
    ...
</div>