在我的CSS中，我目前使用的是:

img.info {
    max-width: 620px;
    max-height: 800px;
}

不幸的是，當我的圖像小于最大寬度和最大高度時，它會被放大。我以為標準行為是不會發生縮放，但顯然，事實并非如此。有什么辦法可以防止圖像放大？

編輯:我找到了問題的根源，它存在于我的程序的一個完全不同的部分。我在上面發布的代碼工作得很好。抱歉這個不必要的帖子！

下面這個極簡主義的例子就很好地說明了這一點:

<style>
    img.a {
        max-width: 640px;
        max-height: 640px;
    }
</style>

<img src="(my local image file)" class="a">

圖像沒有被放大。當然，如果我還添加了寬度和高度屬性，它就可以了。因此，請檢查您是否有任何其他可能應用于您的圖像的CSS屬性。您可以使用Firebug來找出哪些CSS屬性適用于您的圖像。

這樣應該可以了；

img{
 object-fit: scale-down;
}

我想我明白你的意思。 我是否正確地假設你有一個給定的空間，并想用一張圖片來填充它。畫面不應該被擠壓或拉伸，但空間應該被填滿？

那么這可能是您解決方案的第一部分:

div.info {
   width: 620px;
   height: 640px;
   overflow: hidden;
}
?
<div class="info"><img class="info" src="http://www.sjphoto.com/hk-web/images/HK-skyscraper.jpg" width=640 /> </div>?

您現在可以做的是向圖像添加一個onload處理程序，將它傳遞到所需的高度，然后縮放您的圖像并將其放置在div中，這樣它會被平均裁剪。這可能看起來像這樣(未經測試):

function scaleUp(el,height) {  
    if(el.height < height) {
        var oldwidth = el.width;
        el.deleteAttribute('width');
        el.height=height;
        el.style.marginLeft=((oldwidth-el.width)/2)+'px';
    } else if(el.height > height) {
       el.style.marginTop = '-'+((el.height-height)/2)+'px';
    }
}