如何在 Outlook 兼容邮件中精准样式化表格最后一行

outlook 对 css 支持极弱，不识别 :nth-child()、相邻兄弟选择器等现代伪类和组合器；唯一可靠方案是为最后一行显式添加 html class，并通过纯 class 选择器定义样式。

在构建 html 邮件（尤其是需兼容 microsoft outlook）时，css 兼容性是核心挑战。Outlook 沿用旧版 word 渲染引擎（而非 webkit 或 Blink），其 CSS 支持极为有限——根据 Mailchimp 邮件客户端 CSS 支持表，Outlook 完全不支持以下关键特性：

• 伪类选择器：tr:last-child、tr:nth-child(n)、:first-of-type 等
• 组合器：+（相邻兄弟）、~（通用兄弟）、>（子选择器）均不可靠或完全失效
• 属性选择器（如 [data-last]）及自定义数据属性亦不被识别

✅ 正确做法：服务端/模板层主动标记最后一行

在生成 HTML 表格时，动态为

添加语义化 class（如 last-row），并在内联

Row 1

Row 2

Row 3

✅ This is the last row

⚠️ 注意事项：

• 务必使用 !important：Outlook 可能覆盖内联样式，强制声明可提升可靠性；
• 避免嵌套 class 或复杂结构：如 .table-wrapper .last-row 在 Outlook 中可能失效，推荐扁平化命名（如 footer-row, summary-row）；
• 禁用外部样式表与 ：邮件客户端普遍屏蔽外部 CSS，所有样式必须内联或置于