<table width="378" border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td height="30" width="50" bgcolor="#e8e8e8"> </td>
<td style="color: #ffffff; font-weight: bold; font-family: serif; font-size: 14px; padding-top: 0px; padding-bottom: 0px;" height="30" valign="middle" width="300" align="left" bgcolor="#00aec7">This should vertically center!</td>
</tr>
</tbody>
</table>
在 Gmail 中，它居中，但在 Outlook 中，它位于彩色栏的顶部。我也尝试使用 line-height 和 vertical-align 但 vertical-align 不起作用并且 line-height 必须设置为比应有的更小的尺寸(20px 似乎居中，尽管 TD 高 30px)然后使其在 GMail 中顶部对齐!
最佳答案
将文本包装在段落和 span 标记中，并为它们设置 100% 的行高是修复它的唯一更改。 Outlook 用它自己认为“正确”的解释和原始代码的表示替换所有 HTML(通过查看消息源确定此更改)。
<p style="height: 30px; line-height: 100%; margin: 0px; padding: 0px; font-size: 14px;"><span style="margin: 0px; padding: 0px; font-size: 14px;">This should vertically center!</span></p>
使用带有“px”、“pt”或“em”的line-height 无效。只有“100%”有效。
关于html - 为什么此 HTML 代码在 Outlook(HTML 电子邮件)中没有在中间垂直对齐？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/28332104/