Outlook外部邮件免责声明HTML渲染异常问题求助

Outlook采用Word渲染引擎，对普通HTML元素（如div）的CSS支持存在诸多限制，你的代码里有几个关键问题导致显示异常：

• div的border、padding样式在Outlook中无法被正确解析
• 字体名称写错（times roman应为times new roman）
• 小数像素的border会被Outlook直接忽略

修复核心是改用邮件HTML标准的表格布局，同时修正样式细节：

<table cellpadding="0" cellspacing="0" border="0" width="100%">
  <tr>
    <td style="background-color:#6385ce; border:4px solid #1e3679; padding:12px;">
      <span style="font-size:12pt; font-family: 'Cambria','Times New Roman','Garamond',serif; color:#FFFFFF; font-weight:bold;">CAUTION:</span>
      <span style="font-size:10pt; font-family: 'Cambria','Times New Roman',serif; color:#FFFFFF;">This email originated from outside. Do not click on links, open attachments, or reply unless you recognize the sender as well as the domain. Follow guidelines for validating payment information with Wires, ACH, etc.</span>
    </td>
  </tr>
</table>

修改细节说明 #

• 用<table>替代<div>：Outlook对表格的样式兼容性远优于块级元素
• 调整border为4px：Outlook不支持小数像素值，3.5px会被截断为3px，改用整数像素保证边框正常显示
• 修正字体名称：将错误的times roman改为标准的Times New Roman，确保字体降级逻辑正常
• 用<td>的padding代替div的padding：保证内边距在Outlook中生效
• 替换<b>为font-weight:bold：内联样式比标签样式在邮件客户端中更稳定
• 添加width="100%"：让表格自适应邮件容器宽度

内容的提问来源于stack exchange，提问作者nscott-boyd