HTML邮件签名在Gmail及Windows Mail中格式异常求助

• 彻底采用表格布局的“复古”写法
  Windows Mail对现代CSS布局（flex/grid）支持极差，必须完全依赖嵌套<table>实现所有排版，每个区块用<table><tr><td>层级包裹，禁止使用任何CSS布局属性。所有间距、对齐优先通过cellpadding/cellspacing属性实现，或嵌套空<td>做间隔，避免依赖margin/padding（不同客户端解析差异极大）。

• 强制全内联样式，禁用外部/内部样式表
  所有样式必须直接写在对应HTML标签的style属性中，比如<td style="font-family: Arial, sans-serif; font-size: 14px; color: #333333;">。字体、颜色、行高这类基础样式，每个文本标签（<span>/<td>）都单独声明，不要依赖样式继承。同时避免CSS缩写，比如把padding: 5px拆写为padding-top:5px; padding-right:5px; padding-bottom:5px; padding-left:5px;。

• 针对Windows Mail的特殊适配

  • 在所有外层<table>标签添加style="mso-table-lspace:0pt; mso-table-rspace:0pt;"，消除客户端默认的表格间距。
  • 图片必须同时声明HTML属性和内联样式的宽高，比如<img src="logo.png" width="80" height="80" style="width:80px; height:80px; border:0;" alt="Logo">，添加border:0避免默认边框。
  • 文本换行不要用<br>，改用独立的<tr><td>实现，Windows Mail对<br>的解析常出现异常间距。

• 测试与调试技巧

  • 不要直接复制粘贴到邮件客户端，先将HTML保存为本地.html文件，用Windows Mail直接打开预览，调整无误后再复制。
  • 采用逐步简化法：先保留核心文本和图片，确认显示正常后再逐步添加其他元素，定位异常模块。
  • 仅使用系统默认字体（Arial、Times New Roman、Verdana等），Windows Mail不支持Web字体。

• 修正后代码示例

<table cellpadding="0" cellspacing="0" border="0" style="mso-table-lspace:0pt; mso-table-rspace:0pt; font-family: Arial, sans-serif; font-size:14px; color:#333;">
  <tr>
    <td width="80" style="padding-right:15px;">
      <img src="your-logo.png" width="80" height="80" style="width:80px; height:80px; border:0;" alt="Your Logo">
    </td>
    <td>
      <table cellpadding="0" cellspacing="0" border="0">
        <tr>
          <td style="font-size:16px; font-weight:bold; color:#222;">Tyler Jarvis</td>
        </tr>
        <tr>
          <td style="padding-top:5px; color:#555;">Senior Developer</td>
        </tr>
        <tr>
          <td style="padding-top:8px;">
            <span style="color:#0066cc;">+1 (555) 123-4567</span> | <span style="color:#0066cc;">tyler@example.com</span>
          </td>
        </tr>
      </table>
    </td>
  </tr>
</table>

内容的提问来源于stack exchange，提问作者Tyler Jarvis