img上的最小高度没有变形

Question

有一种方法可以放置图像的最小高度而不会扭曲它吗？

示例：

min-height: 500px

但是没有扭曲它，我正在创建一个电子商务，我的员工上传图像时遇到了问题。

我想增加纵横比设置最小高度。

Answer 1

您可以使用max-sizes控制图像的高度和宽度，然后将width和height属性设置为auto。

img {
    display: block;
    max-width:800px;
    max-height:500px;
    width: auto;
    height: auto;
}

这会调整图像保持纵横比，而不会大于声明的尺寸。

你也可以定义最小高度，键是设置宽度，高度是自动保持宽高比