我已经为客户端构建了一个包含表格的电子邮件,但是当我在AOL中测试时,会在图像之间添加额外的填充。看起来每个图像右侧都添加了3px空间......这是我的代码:
<table border="0" cellspacing="0" cellpadding="0" align="center" width="700" valign="top">
<tr>
<td>
<img src="images/nav-gaming.jpg" align="left" style="display:block; vertical-align:bottom" width="104" height="33" border="0" /> <img src="images/nav-poker.jpg" align="left" style="display:block; vertical-align:bottom" width="104" height="33" border="0" /> <img src="images/nav-restaurant.jpg" align="left" style="display:block; vertical-align:bottom" width="102" height="33" border="0" /> <img src="images/nav-tanzibar.jpg" align="left" style="display:block; vertical-align:bottom" width="92" height="33" border="0" /> <img src="images/nav-events.jpg" align="left" style="display:block; vertical-align:bottom" width="82" height="33" border="0" /> <img src="images/nav-packages.jpg" align="left" style="display:block; vertical-align:bottom" width="96" height="33" border="0" /> <img src="images/nav-rewards.jpg" align="left" style="display:block; vertical-align:bottom" width="120" height="33" border="0" />
</td>
</tr>
</table>
我是否错过任何令人眼花缭乱的明显事物?我已经测试过将每个图像添加到表格中的新td,但这会产生同样的问题。
答案 0 :(得分:0)
将图像放入自己的表格单元格中总是更安全:
<table border="0" cellspacing="0" cellpadding="0" width="700">
<tr>
<td>
<img src="images/nav-gaming.jpg" align="left" style="margin: 0; border: 0; padding: 0; display: block;" width="104" height="33" border="0" />
</td>
<td>
<img src="images/nav-poker.jpg" align="left" style="margin: 0; border: 0; padding: 0; display: block;" width="104" height="33" border="0" />
</td>
<td>
<img src="images/nav-restaurant.jpg" align="left" style="margin: 0; border: 0; padding: 0; display: block;" width="102" height="33" border="0" />
</td>
<td>
<img src="images/nav-tanzibar.jpg" align="left" style="margin: 0; border: 0; padding: 0; display: block;" width="92" height="33" border="0" />
</td>
<td>
<img src="images/nav-events.jpg" align="left" style="margin: 0; border: 0; padding: 0; display: block;" width="82" height="33" border="0" />
</td>
<td>
<img src="images/nav-packages.jpg" align="left" style="margin: 0; border: 0; padding: 0; display: block;" width="96" height="33" border="0" />
</td>
<td>
<img src="images/nav-rewards.jpg" align="left" style="margin: 0; border: 0; padding: 0; display: block;" width="120" height="33" border="0" />
</td>
</tr>
</table>
如果您尝试浮动图像,则只有例外(要浮动,您需要删除display:block;
)。浮动有时可能会出现问题,除非您的桌面单元中有足够的空余空间。