我有一个非常简单的 HTML 电子邮件模板 - 仅用于测试 - 它有 5 列,其中有一个词,问题是在 Outlook 2013 中,第一列总是垂直错位。这是 HTML。
<!DOCTYPE html>
<html><body>
<table width="95%" cellpadding="0" cellspacing="0" border="0" id="wrapper_table" style="border-collapse: collapse; border-spacing: 0; vertical-align: top; height: 100%; width: 100%;"><tbody><tr><td style="font-weight: normal; text-align: left; vertical-align: top;">
<table width="600" cellpadding="0" cellspacing="0" border="0" id="content_1" style="border-collapse: collapse; border-spacing: 0; vertical-align: top;"><tr><td style="font-weight: normal; text-align: left; vertical-align: top;">
<table width="100%" cellpadding="0" cellspacing="0" border="0" id="test" style="border-collapse: collapse; border-spacing: 0; vertical-align: top;"><tr><td style="font-weight: normal; text-align: left; vertical-align: top; border: 1px solid black;">
Row
</td>
<td style="font-weight: normal; text-align: left; vertical-align: top; border: 1px solid black;">
Row
</td>
<td style="font-weight: normal; text-align: left; vertical-align: top; border: 1px solid black;">
Row
</td>
<td style="font-weight: normal; text-align: left; vertical-align: top; border: 1px solid black;">
Row
</td>
<td style="font-weight: normal; text-align: left; vertical-align: top; border: 1px solid black;">
Row
</td>
</tr></table></td>
</tr></table></td>
</tr></tbody></table></body></html>
Outlook 2013 中的结果是:
这是 Outlook 的代码输出
<!DOCTYPE html><br />
<html><body> <br />
<table width="95%" cellpadding="0" cellspacing="0" border="0" id="wrapper_table" style="border-collapse: collapse; border-spacing: 0; vertical-align: top; height: 100%; width: 100%;"><tbody><tr><td style="font-weight: normal; text-align: left; vertical-align: top;"><br />
<table width="600" cellpadding="0" cellspacing="0" border="0" id="content_1" style="border-collapse: collapse; border-spacing: 0; vertical-align: top;"><tr><td style="font-weight: normal; text-align: left; vertical-align: top;"><br />
<table width="100%" cellpadding="0" cellspacing="0" border="0" id="test" style="border-collapse: collapse; border-spacing: 0; vertical-align: top;"><tr><td style="font-weight: normal; text-align: left; vertical-align: top; border: 1px solid black;"><br />
Row<br />
</td><br />
<td style="font-weight: normal; text-align: left; vertical-align: top; border: 1px solid black;"><br />
Row<br />
</td><br />
<td style="font-weight: normal; text-align: left; vertical-align: top; border: 1px solid black;"><br />
Row<br />
</td><br />
<td style="font-weight: normal; text-align: left; vertical-align: top; border: 1px solid black;"><br />
Row<br />
</td><br />
<td style="font-weight: normal; text-align: left; vertical-align: top; border: 1px solid black;"><br />
Row<br />
</td><br />
</tr></table></td><br />
</tr></table></td><br />
</tr></tbody></table></body></html><br />
问题与 outlook 添加的所有额外 BR 标签有关,但我该怎么办?
谢谢!
最佳答案
据我所知,电子邮件中不支持外部样式,并且样式必须在每个标签内联应用。您是否尝试过在每个嵌套的 tds 上添加 valign="top"
?
<td valign="top">
Row
</td>
您也可以尝试关闭嵌套在标签中的任何空格,例如:
<td valign="top">Row</td>
关于Outlook 2013 中的 HTML 电子邮件未对齐?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19497925/