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>

将div调整为图像大小

2 个答案: