html - 图片放在 table 上 - HTML 邮件

Question

我正在寻找一种使图像覆盖某些表格的可能方法。我尝试了 Z 定位，但没有成功。也许我没有做对。我希望有人能给我一些提示，让我朝着正确的方向前进。

提醒:我不能使用 div，因为它是 HTML 邮件。

代码示例:

<table width="100%" align="center" border="0" cellspacing="0" cellpadding="0">
    <tr>
        <td align="left" bgcolor="ffffff" width="69%" class="bodycopy shadow" style="padding: 10px;">
            <p class="h1">Lorem Titel            </p>
            <p class="h2">Lorem subtitle
            </p>
            <p class="bodycopy">
                Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam dictum eleifend purus, eu lobortis odio viverra ac. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Maecenas non lobortis purus, et convallis dolor. In euismod felis sed ex consequat, non suscipit magna laoreet. Etiam non libero consequat erat interdum sollicitudin nec ut est. Nam quis nisl mi. Nulla lobortis justo nulla, ac vestibulum mauris dictum nec.
                <br />
                <br />Lorem ipsum.
                <br />dolar sit amet
            </p>
            <a href="#" </a>
        </td>
        <td width="2%">
            <img style="top: 0; z-index: 2; border: 1px solid #f00;" src="Fotos/icon-vb.gif">
        </td>
        <td align="right" class="shadow" width="29%">
            <img class="fix" src="ipod.gif" width="100%" border="0" alt="" />
        </td>
    </tr>
</table>

Answer 1

在 html 和 CSS 中进行以下更改。添加 z-index: 999;position:absolute; 到小图像和 position:relative; 到其他

FIDDLE DEMO

HTML

 <img class='smallimg' src="Fotos/icon-vb.gif">

CSS

  .smallimg {
    z-index: 999;
    position:absolute;
    border: 1px solid #f00
}
.fix {
    position:relative;
}