0

我正在做html 电子邮件模板 ，并且在页脚表中我需要做的是，书籍图像有点弹出<td> 看左边的图像，这是我需要做的，我所拥有的是在右边

在此处输入图像描述

所以请指导我如何做到这一点。 

<tr style=" background-color:#2582bb;">

 <td width="113" height="214" valign="top"> 
 <img src="images/footer.png"  width="113" height="161"/>
  </td>

    </tr>
4

2 回答 2

4

另一个答案适用于网络，但对于 html 电子邮件不正确 - 许多电子邮件客户端不支持位置，包括 Gmail、Yahoo、Outlook 07、10 和 13、Lotus Notes 6 和 7、Android 2.3 Gmail 和 Windows Mobile 7。请参阅来自 Campaign Monitor的CSS 支持指南- 下载完整指南 PDF 以获取完整的支持细分。

在 html 电子邮件中只有两种方法可以做到这一点：

  1. 将您的图像一分为二，并在上面的表格行中突出顶部图像/部分
  2. 如果要将其保留为完整图像，则必须使用 rowspan （或 colspan 用于水平突出）

这是一个行跨度示例：

<table width="600" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td width="100" height="100" bgcolor="#F5F5F5">&nbsp;
    </td>
    <td width="400" rowspan="2" bgcolor="#252525">
      <img style="margin: 0; border: 0; padding: 0; display: block;" src="" width="400" height="300" alt="">
    </td>
    <td width="100" height="100" bgcolor="#F5F5F5">&nbsp;
    </td>
  </tr>
  <tr>
    <td width="100" height="200" bgcolor="#959595">&nbsp;
    </td>
    <td width="100" height="200" bgcolor="#959595">&nbsp;
    </td>
  </tr>
</table>
于 2013-08-01T13:19:28.017 回答
4

添加一个divwithrelative定位，让你img有一个absolute位置。调整顶部或底部参数并获得所需的输出。

这是解决方案。

编码：

<td width="113" height="214" valign="top"> 
    <div style="position:relative;">
      <img style="position:absolute; top:xx px; bottom: xx px" src="images/footer.png"  width="113" height="161"/>
    </div>
</td>

PS：使用顶部或底部。xx 是一个虚拟值，插入像素值得到你想要的。

于 2013-08-01T11:06:40.937 回答