将div调整为图像大小

Question

通常情况下，我使用背景图像将图像调整为div，具体取决于宽度和高度属性。现在我有完全相反的问题。

我想要做的是调整div大小的图像，但最大的宽度和高度。假设图像是200x200，div必须调整到这个大小，但如果图像超过300x300，它必须受到限制。

任何想法，我应该怎么做呢？

Answer 1

您可以将max-width和max-height样式属性应用于图像元素。

根据您需要包含的元素做什么，这可能工作：

<div> 
    <div style="position: absolute;">Element content here</div> 
    <img src="image.png" style="max-width: 300px; max-height: 300px;" /> 
</div> 

Answer 2

什么是你的页面的结构？

我猜你用这样的：

<div id="container"> 
    <img src="img.jpg" /> 
</div> 

<style> 
    #container { 
     display: inline-block; 
     border:1px solid blue; 
     max-width:300px; 
     max-height:300px; 
    } 
</style>