CSS力图像调整尺寸和保持高宽比

Question

CSS力图像调整尺寸和保持高宽比

我正在处理图像，我遇到了一个与纵横比有关的问题。

<img src="big_image.jpg" width="900" height="600" alt="" />

如你所见，height和width已经指定。我为图像添加了CSS规则：

img {
  max-width:500px;}

但为了big_image.jpg，我收到width=500和height=600..如何将图像设置为调整大小，同时保持它们的纵横比。

Answer 1

我很难解决这个问题，最终找到了一个简单的解决方案：object-fit: cover;width: 100%;height: 250px;您可以调整宽度和高度以满足您的需要，对象匹配属性将为您进行裁剪。干杯。