使用 bootstrap 缩放图像

Question

我使用了 Bootstraps 行功能并使用代码：

<div class="col-md-1">
<img src="1.jpg" />
</div>

我发现放大和缩小时图像不会随列缩放。

我试过用它来包裹我的图像，但没有用。我尝试手动缩放它，但在放大和缩小时它会发生变化。

最后我尝试使用 "Xem" 设置高度和宽度，但这也不起作用。

我如何做到这一点才能使其成为可缩放的大小以使用 bootstrap 列进行缩放。

Answer 1

您需要将 class img-responsive 添加到图片标签。

它记录在 Bootstrap 网站上的图像下

<div class="col-md-1">
    <img class="img-responsive" src="1.jpg" />
</div>

Answer 2

对于 Bootstrap 4 及更高版本，Bootstrap 的最新主要版本截至发帖时，他们将 .img-responsive 重命名为 .img-fluid 所以一定要知道是哪个版本并使用正确的标签。

Scaling an image with bootstrap