Question

我写了一个简单的html电子邮件模板，除了Outlook 2013之外，似乎在所有电子邮件客户端都可以正常呈现。我已经简化了代码来说明下面的问题：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<title>K</title>
<style type="text/css">
   table {border-collapse: collapse;}
</style>
</head>
<body style="margin:0; background-color:#70b9b9; -webkit-text-size-adjust:none;">
<table width="100%" cellpadding="0" cellspacing="0" border="0">
<tbody>
<tr>
<td style="background:black;padding:0;"><img src="http://jl.evermight.net/outlook2013/pic.jpg" alt="" border="0" style="display:block; border:none;" /></td>
</tr>
</tbody></table>
</body>
</html>

此代码的问题在于绿色和图像之间存在黑色间隙，我可以在此处显示：

enter image description here

那么我如何摆脱这种黑色差距呢？同样，这只是outlook2013中的一个问题

Answer 1

您需要将图像中的填充和边距清零。您应该至少设置图像的宽度，即使它是width="100%"。

这是我的基本图像设置：

<td>
  <img alt="" src="" width="" height="" style="margin: 0; border: 0; padding: 0; display: block;">
</td>

此外，Outlook存在短于19px的单元格的问题，因此请确保您的图像足够高。

其他无关的说明：

摆脱<tbody>它在html电子邮件中无效
将background:black;更改为background-color:#000000;，html电子邮件需要6位数的十六进制颜色

Outlook 2013中的HTML电子邮件差距

1 个答案: