Html 调整div大小以适应内部内容

我有一个带有此css的

img

：

maxHeight: "80%"
maxWidth: "80%"

这使得

img

始终保持在屏幕内。现在我想在这个

img

周围放置一个div，并在该div内放置一些其他元素，使它们与

img

重叠。我不知道如何使外部div适合

img

的大小，这样其他内容就不会出现在

img

之外，但是

img

仍然必须始终留在屏幕内。请帮忙！谢谢你，对我的英语感到抱歉

<div class="img-thumb" img-name="@Model[i].TenHinh" img-description="@Model[i].MoTa", img-dim="@Model[i].Width x @Model[i].Height", img-size ="@Model[i].Size">
            <img src="@(domain + "Contents/Imgs/" + @Model[i].MaHinh + @Model[i].Duoi)" />
            <div style="position: relative; display: none;" class="img-preview" >
                <img src="@(domain + "Contents/Imgs/" + @Model[i].MaHinh + @Model[i].Duoi)"/>
                <button style="position: absolute; bottom: 0; left: 0;"><</button>
                <button style="position: absolute; bottom: 0; right: 0;">></button>
            </div>
            <div class="img-panel">
                <button type="button" class="btn-Xem" img-code="@Model[i].MaHinh" img-name="@Model[i].TenHinh">Xem</button>
                <button type="button" class="btn-Xoa" img-code="@Model[i].MaHinh" img-name="@Model[i].TenHinh">Xóa</button>
                <button type="button" class="btn-Sua" img-code="@Model[i].MaHinh">Sửa</button>
            </div>
        </div>

Xem
索阿
sửA.

我的div是.img预览版，我希望它与

img

---

里面

为您的

div

（这里是img thumb）标签设置宽度和高度，然后根据标签设置图像的宽度和高度。或者，您可以直接为图像设置宽度和高度

html，正文{
宽度：100%；
身高：100%；
}
img{
最大宽度：80%；
最高高度：80%；
}

Xem
索阿
sửA.

为您的

div

（这里是img thumb）标签设置宽度和高度，然后根据标签设置图像的宽度和高度。或者，您可以直接为图像设置宽度和高度

html，正文{
宽度：100%；
身高：100%；
}
img{
最大宽度：80%；
最高高度：80%；
}

Xem
索阿
sửA.

我将div.img-preview显示更改为block以查看发生了什么。 我为图片和按钮加了一些包装。 显示flex来整理东西

实际上我看不出有什么困难，你能更具体地回答你的问题吗

.img预览{
位置：相对位置；
宽度：100%；
显示器：flex；
弯曲方向：立柱；
}
.图像，.按钮{
位置：相对}
.按钮{
显示器：flex；
证明内容：之间的空间；
宽度：100%；}
.img预览img{
宽度：100%；}

---

我将div.img-preview显示更改为block以查看发生了什么。 我为图片和按钮加了一些包装。 显示flex来整理东西

实际上我看不出有什么困难，你能更具体地回答你的问题吗

.img预览{
位置：相对位置；
宽度：100%；
显示器：flex；
弯曲方向：立柱；
}
.图像，.按钮{
位置：相对}
.按钮{
显示器：flex；
证明内容：之间的空间；
宽度：100%；}
.img预览img{
宽度：100%；}

添加html代码您也不需要引号中的百分比值。我正在通过jquery设置css:）我只需要一个想法！添加html代码也不需要引号中的百分比值。我正在通过jquery设置css:）我只需要一个想法！我刚刚找到了解决方案，我只需要设置div的大小，然后将其背景设置为img并将其居中。无论如何，非常感谢您的快速回答：）我刚刚找到了解决方案，我只需要设置div的大小，然后将其背景设置为img并将其居中。无论如何，非常感谢您的快速回答：）