Question

我有一个包含数千张图片的文件夹，我想要显示这些图片。

我已经做到了，但我的问题在于图像的大小。我文件夹中的图像格式和大小完全不同。我已经成功调整了它们的大小，但每当我这样做时，当我改变浏览器大小时它们也不会调整大小，它们就像我告诉他们一样。

我想要做的是设置一个最大尺寸，如果浏览器足够大，它们就是这个尺寸。但如果浏览器收缩，他们会立即对此做出反应并改变大小。

我已经尝试了2个小时，但我找不到办法。

PS：我正在使用bootstrap

谢谢！：）

Answer 1

这个怎么样？图像的最大尺寸为1000像素，否则将为浏览器宽度的100％。

img {
    width: 100%;
    max-width: 1000px;
}

Answer 2

以下内容应该为您提供您所寻找的内容：

img {
    height: 100%;
    width: auto;
    max-height: (put max height here in px)px;
}

只要你的图像不比它们的容器小，这就行了。

Answer 3

将class="img-responsive"添加到您的<img>代码中。有关详细信息，请参阅this。

Answer 4

你可以使用img-responsive类，bootstrap提供

Answer 5

你的回答是JSFIDDLE。

img {
display: block;
width: 100%;
max-width: 800px;
}