用 Edge 浏览器看书、看长文时，眼睛容易疲劳。很多人都想把背景调成绿豆沙色（#C7EDCC）。但你是不是也觉得 Edge 的沉浸式阅读器少了点“人情味”？明明只是换个色，怎么翻来覆去就是找不到这个选项？

其实，它并不是不支持绿豆沙色。而是这门手艺藏得有点深。要理解这件事，关键得区分两个概念：

• 沉浸式阅读器内部的预设主题
• 系统层面的页面颜色覆盖

如果混为一谈，很容易误以为功能缺失，或者折腾了半天也不生效。

沉浸式阅读器内选不到绿豆沙色？

沉浸式阅读器的页面颜色下拉菜单，默认只提供浅色、深色和棕褐色三种主题。其中棕褐色实际上是暖米黄（#F5F5DC），根本不是医学上推荐的绿豆沙色。

那么，要怎么把 #C7EDCC 用上去？答案是触发那个隐藏的“自定义颜色”入口。

操作步骤

• 进入沉浸式阅读器后，点击顶部工具栏的 Aa 图标 → 「文本首选项」→ 「页面颜色」→ 注意，这里要点的是「自定义颜色」按钮，而不是下拉菜单里的那几个选项。
• 在弹出来的颜色选择器中，不要依赖拖动的拾色器滑块——精度不够，很容易偏色。直接在十六进制输入框里手动填入 #C7EDCC。
• 同时建议把「文本颜色」设为 #333333，否则灰度过高可能导致对比度不足。WCAG AA 标准要求至少 4.5:1，这个组合刚好满足。
• 需要留意的是：这个设置只对当前会话有效。如果关闭阅读器后再打开，就要重复一遍以上操作。这不是 Bug，而是设计逻辑——沉浸式阅读器默认不会持久化自定义色值。

想要每次打开都是绿豆沙色？直接改默认主题并不管用

你可能会想：那就去 Edge 设置里改啊。如果进到 Edge 设置 → 「外观」→ 「沉浸式阅读器」→ 「默认主题」里选择「棕褐色」，你会发现它绑定的仍然只是系统内置的棕褐色（#F5F5DC），并不会读取之前手动输入的 #C7EDCC。

真正能让自定义色值固化的路径是另一条：

固化自定义色的正确方法

• 先进入任意网页的沉浸式阅读器，按上面步骤完成 #C7EDCC 的自定义设置。
• 然后点击右上角「」→ 「阅读偏好设置」→ 确认「页面颜色」已经显示为「自定义颜色」，并且值确实是 #C7EDCC。
• 勾选「对所有网站启用沉浸式阅读器」（这样可以让那个书本图标常驻在地址栏），但注意：这不影响默认色值的存储。
• 最后关键一步：关闭所有 Edge 窗口——记住，是彻底退出进程。到任务管理器里确认所有 msedge.exe 都已被杀掉。再重新打开，新启动的沉浸式阅读器才会继承上一次保存的自定义颜色。

辅助功能的“页面颜色”能全局覆盖沉浸式阅读器吗？

可以，但这是一个强制注入层，优先级高于沉浸式阅读器自身的主题。开启后，它会将整个页面（包括 body、html 以及几乎所有容器）的背景统一覆盖成指定颜色，沉浸式阅读器内部的渲染区域也不例外。

设置方法及副作用

• 访问 edge://settings/accessibility → 开启「页面颜色」开关。
• 点击「选择背景颜色」→ 手动输入 #C7EDCC（记得手输，因为拾色器的默认范围根本不包含这个值）。
• 同时把「文本颜色」设为 #333333，并勾选「对沉浸式阅读器应用此设置」（新版 Edge 中这个选项默认可见）。

副作用也明显：

• 部分网页的 SVG 图标、Canvas 渲染内容，以及内联 style 设置背景的地方，可能被强制覆盖，导致色块错位。
• PDF 内嵌页在沉浸式阅读器中也可能出现失真。

用 CSS 注入调试：为什么 document.body.style.backgroundColor 不生效？

因为沉浸式阅读器运行在独立的 Shadow DOM 容器里。直接操作 document.body 只会影响外层浏览器页面，对阅读器内部完全无效。正确的做法是定位到它的 Shadow Root。

调试方法

• 在沉浸式阅读器界面按 F12 → 切换到「控制台」，执行以下代码：

const shadowHost = document.querySelector('ir-root');
if (shadowHost) {
  const shadowRoot = shadowHost.shadowRoot;
  if (shadowRoot) {
    const style = document.createElement('style');
    style.textContent = 'html, body { background-color: #C7EDCC !important; color: #333333 !important; }';
    shadowRoot.appendChild(style);
  }
}

• 这个脚本只在当前页面生效，刷新即失效。而且不能写进书签或扩展，因为 Edge 会阻止跨域脚本注入 Shadow DOM。
• 如果发现文字发虚，可能是 !important 冲突导致字体抗锯齿异常，这时候需要补加 -webkit-font-smoothing: antialiased;。

说到底，真正的难点在于权衡：

• 用辅助功能的「页面颜色」最省事，但可能会破坏原页面的结构。
• 用沉浸式阅读器的自定义色最干净，但每次重启都要确认进程是否已清空。
• CSS 注入最灵活，却无法持久。

多数人卡在了第一步——根本没意识到「自定义颜色」的按钮不是藏在主题下拉菜单里，而是藏在 Aa 面板更深的角落里。

《夸克》非常好用的免费AI浏览器

下载APP查看