将固定大小的图像限制在div容器中？

Question

我有一个div ，它相对位于包装器内部。 当用户选择一个选项时，预定义尺寸的图像将发送到客户端并显示在此div 。

但是，由于div相对位置的宽度和高度以%设置，因此对于低分辨率监视器，图像有时会跳出div 。

如何在不对服务器进行任何更改（更改img大小）的情况下处理此问题？图像的大小以像素为单位。 我正在使用一个自定义控件来创建此img，它具有局限性，例如无法以％设置宽度和高度。 我必须指定像素。

Answer 1

您可以按％设置图像高度，例如90％或100％。

Answer 2

如果图像尺寸为400 * 400。 保持div的最小宽度和最小高度为400，如下所示。

img{
max-width: 400;
max-height: 400;
}

Answer 3

为什么不在CSS中设置最大宽度？

div{
 max-width:400px;
 width:50%;
 height:auto;
}

div img{
  max-width:400px;
  width:100%;
  position:relative;
}

你既可以使用min-width也可以使用max-width :)

Answer 4

采用：

 img{
      width:100%;
      position:relative;
    }