比例<img>裏面的div

Question

我有固定寬度和高度（400x300px）的div包裝。在自己的寬度/高度（橫向800x600px）或（縱向600x800px）內，圖像可能有不同的大小。我如何用CSS進行縮放，以便可以按比例縮小比例以適應寬度或高度 - 以先到者爲準？

下面的代碼：

<div style="width:400px; height:300px;"> 
    <img style="width:auto; height:auto;" src="image url>" /> 
</div> 

感謝

Answer 1

使用最大寬度和最大高度：

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

Answer 2

.your-image { 
    max-width: 100%; 
    max-height: 100%; 
} 

見DEMO。