当前位置: 首页 >  Chrome浏览器插件支持夜间模式切换

Chrome浏览器插件支持夜间模式切换

时间:2025-05-25 来源:谷歌浏览器官网
详情介绍

Chrome浏览器插件支持夜间模式切换1

1. 安装夜间模式插件
- 在Chrome应用商店搜索“Dark Reader”或“Night Eye”,点击“添加到Chrome”完成安装。
- 使用步骤:打开任意网页→点击插件图标→选择“开启夜间模式”,页面背景自动变暗(可自定义颜色深浅和对比度)。
2. 通过开发者工具强制开启暗黑模式
- 按`Ctrl+Shift+I`打开开发者工具→切换到“Console”标签页,输入命令`document.body.style.filter='invert(1)'`,页面颜色反转(适合临时测试)。
- 若需全局生效,进入Chrome设置→“外观”→勾选“使用系统主题色”(需操作系统已开启深色模式)。
3. 自定义夜间模式规则(进阶操作)
- 安装“Stylebot”插件→创建新样式→输入代码:
css
body {
background-color: 121212 !important;
color: ccc !important;
}
img, video {
filter: brightness(0.8) !important;
}

- 保存后,点击插件图标→选择新样式→当前网页立即应用自定义夜间效果(可调整亮度、文字颜色等参数)。
4. 利用脚本自动切换模式
- 安装“Tampermonkey”插件→创建新脚本,添加代码:
javascript
var isDark = document.body.classList.contains('dark-mode');
document.body.classList.toggle('dark-mode', !isDark);
if (!isDark) {
document.body.style.backgroundColor = '1e1e1e';
document.body.style.color = 'e0e0e0';
} else {
document.body.style.backgroundColor = '';
document.body.style.color = '';
}

- 保存后,访问网页时点击插件图标→运行脚本→页面自动切换为夜间风格(需根据网站结构调整样式优先级)。
5. 解决夜间模式兼容性问题
- 若图片/视频显示异常,在开发者的工具→“Elements”面板中找到相关标签→添加内联样式`filter: brightness(1.2)`提升亮度。
- 部分网站可能禁用插件,可在Chrome设置→“隐私与安全”→“站点设置”中解除对插件的限制(如`example.com`)。
6. 同步夜间模式设置到其他设备
- 在Chrome设置中登录Google账号→启用“同步”功能→勾选“主题设置”→在其他设备登录相同账号,自动同步夜间模式偏好(需确保所有设备Chrome版本一致)。
继续阅读
TOP