Question

这里我使用3张图片，我需要第3张图片上的文字。
我的代码是：

<div style="position: relative; left: 0; top: 0;">
    <img src="Images/img1.png" style="position: relative; top: 0; left: 0;" />
    <img src="Images/img2.png" style="position: absolute; top: 10px; left:450px;" />
    <img src="Images/img3.png" style="position: absolute; top: 0px; left:720px;" />
    <div style="position:relative;top: 0px; left:720px;">
        Home<br />
        contact<br />
    </div>
</div>

Answer 1

relative使用absolute这样的基本更改

<div style="position:absolute;top: 0px; left:720px;">
                            Home<br />
                            contact<br />
</div>

相对定位 - 相对定位元素相对于其正常位置定位。

绝对定位 - 绝对位置元素相对于第一个具有静态位置的父元素定位。

查看更多详情：CSS Positioning

Answer 2

您是否尝试将文字div置于absolute位置？它位于relative div ...

中

<div style="position: relative; left: 0; top: 0;">
    <img src="Images/img1.png" style="position: relative; top: 0; left: 0;" />
    <img src="Images/img2.png" style="position: absolute; top: 10px; left:450px;" />
    <img src="Images/img3.png" style="position: absolute; top: 0px; left:720px;" />
    <div style="position:absolute;top: 0px; left:720px;">
        Home<br />
        contact<br />
    </div>
</div>

Answer 3

你应该使用position：absolute而不是position：relative来使元素脱离流。但是，您需要调整left和top属性。

图像在文本上

3 个答案: