Microsoft Edge强制扩展侧边栏深色模式，如何固定为浅色？

以下是几个经过验证的解决方法，按优先级尝试：

1. 给iframe添加force-color-adjust: none样式 #

这个CSS属性可直接阻止浏览器对元素及其子内容进行强制颜色调整。在包含iframe的侧边栏页面中，为iframe元素设置该样式：

iframe {
  force-color-adjust: none;
}

同时在侧边栏主HTML文档的<head>中添加颜色方案meta标签，强化浅色模式声明：

<meta name="color-scheme" content="light only">

only关键字会明确告知浏览器不要切换到深色模式。

2. 禁用Edge扩展的系统主题同步 #

Edge针对扩展侧边栏有单独的主题同步逻辑，即使关闭全局强制深色，仍可能作用于扩展：

• 打开Edge扩展管理页面（edge://extensions/）
• 找到目标扩展，点击详细信息
• 关闭使用系统主题选项（若存在）

3. 在侧边栏页面强制锁定浅色样式 #

在Manifest V3指定的侧边栏HTML页面中，通过CSS强制锁定全局颜色和背景，避免被浏览器反转：

/* 侧边栏主页面全局样式 */
html, body {
  color-scheme: light !important;
  background-color: #ffffff !important;
  color: #000000 !important;
}

/* 强化iframe的浅色设置 */
iframe {
  background-color: #ffffff !important;
  color-scheme: light !important;
  force-color-adjust: none !important;
}

4. 检查Edge深色模式自定义规则 #

Edge的自定义深色规则可能单独作用于扩展：

• 打开Edge设置 → 外观 → 深色模式
• 查看自定义深色模式下的规则，确保未将你的扩展侧边栏加入强制深色列表
• 选择仅选定的网站并移除所有相关规则

注意：若iframe加载的是外部站点，无法修改外部站点CSS时，force-color-adjust: none是最有效的方案，它会直接阻止浏览器对iframe内部内容进行颜色反转。

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