html - 如何在具有绝对位置的 div 之后正确添加内容

Question

我的代码是：

<div style="position: relative; clear: both;">
<img src="/b_doodles/banner.png" style="width: 100%; height: 100px; position: absolute;">
<img src="/b_doodles/profile-pic.png" style="width: 70px; height: 70px; position: absolute; top: 30px;">
</div>
This text is not being displayed

我试过的：

<div style="position: relative; clear: both;">
<img src="/b_doodles/default-banner.png" style="width: 100%; height: 100px; position: absolute;">
<img src="/b_doodles/default-profile-pic.png" style="width: 70px; height: 70px; position: absolute; top: 30px;">
</div><br><br><br><br><br><br>
<div style="position: absolute;">
This text is being displayed
</div>

此代码用于获取两个相互重叠的图像和图像之后的文本（下一行）。

那种工作，但我不认为这真的是一个好主意。请帮忙。

标签： htmlcss

Answer 1

您可以在第一个 div 中输入固定高度。