如果是背景图片，使用background-size:contain。

css例子:

#your-div {
  background: url('image.jpg') no-repeat;
  background-size:contain;
}

控制规模，保持比例:

#your-img {
    height: auto; 
    width: auto; 
    max-width: 300px; 
    max-height: 300px;
}

如果是背景图片，使用background-size:contain。

css例子:

#your-div {
  background: url('image.jpg') no-repeat;
  background-size:contain;
}

试试这个:

div.container {
    max-width: 200px;//real picture size
    max-height: 100px;
}

/* resize images */
div.container img {
    width: 100%;
    height: auto;
}

Try

transform: scale(0.5, 0.5);
-ms-transform: scale(0.5, 0.5);
-webkit-transform: scale(0.5, 0.5);

img{
    max-width:100%;
    object-fit: scale-down;
}

对我有用。它缩小较大的图像以适应方框，但较小的图像保持原始大小。