html - 如何在 C# 中的图像顶部添加内容

Question

我正在用 C# 创建一个网站，我需要在其中添加图像上的内容。图片不应设置为背景图片，但应在 img 标签内设置。每当我尝试添加内容(例如要显示在图像顶部的表格或标签)时，它都会出现在图像之前或之后，而不是图像本身。如何使内容出现在我添加的图像上？请帮忙。

这是我的代码:

<form id="form1" runat="server">
    <div id="main">
        <div id="bg2">
            <img src="Pics/slide.png" style="width:100%; height:100%">
                <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
            </img>
        </div>
    </div>
</form>

Answer 1

将 position:relative; 添加到包含元素，例如bg2 和 position:absolute; 到您的文本。

这会将内容从文档流中取出，并允许您相对于父相对定位元素(在本例中为 bg2)定位文本。

例如:

#bg2
{ 
    position:relative; 
}

#bg2 input[type="text"] 
{ 
    position:absolute; 
    top:50%; 
    left:50%; 
}

Further reading