
本文详解如何使用嵌套表格与 outlook 条件注释,构建跨平台(outlook、gmail、apple mail 等)稳定的左右对齐文本行,规避转发导致的 `align` 属性被覆盖、rtl 干扰等常见问题。
在电子邮件开发中,“左文本 + 右文本”并排显示看似简单,但实际是兼容性陷阱最密集的场景之一。根本原因在于:Outlook(尤其是桌面版)使用 Microsoft Word 渲染引擎,对 HTML/CSS 支持极弱,且在转发邮件时会自动注入
、 等破坏性标签,强制重写
✅ 正确解法:双轨式表格结构 + Outlook 专属条件注释
核心思路不是“修复被篡改的 td”,而是主动隔离 Outlook 的渲染路径:为 Outlook 单独提供一个像素级精确控制的内层表格(用固定宽度),同时通过 [if mso] 条件注释确保该结构仅被 Outlook 解析;其他客户端(Gmail、Yahoo、Apple Mail)则使用标准的百分比宽度表格,完全不受干扰。
以下是可直接复用的、已验证兼容主流邮箱(含 Outlook 2013–2021、Outlook.com、Gmail Web/App、iOS Mail)的最小可行代码:
|
? 关键要点说明
- 是黄金组合:前者仅被 Outlook(MSO)识别,后者被所有非 Outlook 客户端解析(注意闭合注释









