我已经尝试了阳光下的一切，用我当前的HTML代码使一些文本出现在图像上，但无济于事。
无论我做什么，文本总是出现在整个页面的底部，而不是出现在图像上。
我在SO上看了很多帖子，但它们对我不起作用。
以下是我在解决此问题并继续前进方面的众多尝试之一。
我做错了什么，我该如何解决？
这是我的HTML代码：
<body width="100%" bgcolor="#f4f8f1">
<table border="0" width="100%" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td align="center">
<table border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td class="width-320" style="margin: 0 auto;" width="600">
<table border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td class="width-320 header-welcome" width="600">
<a href="#">
<img class="hide" style="display: block;" src="https://upload.wikimedia.org/wikipedia/commons/thumb/f/ff/Solid_blue.svg/225px-Solid_blue.svg.png" alt="some text" width="1200" height="1000" border="0" />
<p>This is always appearing on the bottom of the page!</p>
</a>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</body>使用position:absolute和left:0right:0也使用z-index显示图像上方的文本 希望这有帮助！
<body width="100%" bgcolor="#f4f8f1">
<table border="0" width="100%" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td align="center">
<table border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td class="width-320" style="margin: 0 auto;" width="600">
<table border="0" cellspacing="0" cellpadding="0">
<tbody>
<tr>
<td class="width-320 header-welcome" width="600">
<img class="hide" style="position: absolute; top: 0; left: 0; z-index:-1;" src="https://upload.wikimedia.org/wikipedia/commons/thumb/f/ff/Solid_blue.svg/225px-Solid_blue.svg.png" alt="some text" width="1200" height="1000" border="0" />
<p>This is always appearing on the bottom of the page!</p>
</a>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</body>从 css 中添加图像
.bg-img {
background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/f/ff/Solid_blue.svg/225px-Solid_blue.svg.png);
}<a href="#">
<div class="bg-img">
<p>This is always appearing on the bottom of the page!</p>
</div>
</a>_ 发送电子邮件后检查文件图像是否真的链接。 _ 定义一个 -> style='display：block;' _ 也许你可以试试：在：style='display：block;宽度：x;高度：X;背景： url('link_image'( 不重复 0 0;
对于电子邮件，您需要以下内容：
<tr>
<td class="width-320 header-welcome" width="600" background="https://upload.wikimedia.org/wikipedia/commons/thumb/f/ff/Solid_blue.svg/225px-Solid_blue.svg.png">
<p>
<a href="#" style="color: #ffffff;">This is always appearing on the bottom of the page!</a>
</p>
</td>
</tr>
您还需要确保在此处生成编码，以便背景图像显示在 Outlook - https://backgrounds.cm/中。
在理想情况下，您会将valign="middle"添加到表格单元格中，以确保文本位于中间，但这在Outlook中也不起作用。我建议添加具有设置高度的表格行，以便您可以适当地间隔内容。