如何设置Outlook专属Dark mode规则，解决Mac端显示异常问题

架构老林

2026-9-27

Mac 端 Outlook 暗黑模式适配规则

针对 Mac 版 Outlook 强制反转内容颜色、图片背景异常、部分内容不显示的问题，可按以下规则适配：

先禁用 Outlook 自动反转逻辑
在邮件代码的 <head> 部分添加以下两个 meta 标签，告知 Outlook 你已完成暗黑模式适配，无需系统自动调整内容：
```
<meta name="color-scheme" content="light dark">
<meta name="supported-color-schemes" content="light dark">
```
图片背景防反转处理
不要用 CSS 给图片加白色背景，直接把背景色合成到图片素材中；如果必须用 CSS 背景，给图片添加样式 background-color: #fff !important; filter: none !important;，外层包裹的容器添加 mso-element-wrap: no-wrap-beside 属性。

写专属暗黑模式样式
用以下媒体查询区分 Mac 端 Outlook 暗黑模式，针对性写样式覆盖默认渲染逻辑：

/* 通用暗黑模式适配 */
@media (prefers-color-scheme: dark) {
  body {
    background-color: #1c1c1e !important;
    color: #ffffff !important;
  }
}
/* Mac 端 Outlook 专属暗黑模式适配 */
@media (prefers-color-scheme: dark) and (mso-high-contrast: active) {
  img {
    filter: none !important;
    forced-color-adjust: none !important;
  }
  /* 其他需要覆盖的样式可在这里添加 */
}