Bootstrap-是否可以根据列大小调整图像大小？

Question

我正在使用Bootstrap创建图片库。 全屏时看起来不错

最小尺寸看起来不错

但是在调整大小时，它会执行此操作

我希望第一个图像（树木）与第二个图像（湖泊）一样宽，并且我尝试过调整宽度/最大宽度，但是问题是当第二个图像不能缩小时图片已准备好与第一张图片对齐。

当图像为col-sm-＃时是否可以具有一定的宽度，而将其设置为col-md-＃时可以具有不同的宽度？

Answer 1

考虑将两者都设置为div的背景图像封面。 这将允许您在保留适当的图像纵横比的同时调整div的大小。

.yourdiv1{
  background: url(images/yourimage.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.yourdiv2{
  background: url(images/yourotherimage.jpg) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}