点亮夜色，留驻舒适——Edge与Chrome浏览器暗模式设置指南

前端

2024-01-17 07:59:22

在 Microsoft Edge 和 Google Chrome 中拥抱暗模式：提升浏览体验

解锁视觉舒适、节能和隐私

现代网络浏览器的暗模式是一种深色主题，它可以通过降低屏幕亮度和减少蓝光照射来提升浏览体验。Edge 和 Chrome 等流行浏览器都提供暗模式设置，让用户可以根据自己的喜好对其进行自定义。

如何在 Edge 浏览器中启用暗模式

1. 开启暗模式：

打开 Edge 浏览器并点击右上角的三个点 (...)。
选择 "设置"。
在 "外观" 选项卡中，找到 "主题" 部分并选择 "深色" 主题。

2. 自定义暗模式：

Edge 浏览器允许你对暗模式进行微调，包括：
- 颜色方案：选择 "深灰色"、"黑色" 或 "自定义" 方案。
- 强调色：改变浏览器窗口标题栏、选项卡栏和工具栏的颜色。
- 自定义背景图像：上传一张你喜欢的图片作为浏览器窗口的背景。

3. 在特定网站启用暗模式：

Edge 还可以让你在特定网站启用暗模式。
打开你想启用暗模式的网站，点击地址栏右端的 "锁" 图标。
选择 "网站设置"，然后在 "外观" 部分选择 "深色" 主题。

如何在 Chrome 浏览器中启用暗模式

1. 开启暗模式：

打开 Chrome 浏览器并点击右上角的三个点 (...)。
选择 "设置"。
在 "外观" 选项卡中，找到 "主题" 部分并选择 "深色" 主题。

2. 自定义暗模式：

Chrome 浏览器提供了以下自定义选项：
- 颜色方案：选择 "浅灰色"、"深灰色" 或 "黑色" 方案。
- 字体：改变浏览器窗口、选项卡栏和工具栏的字体。
- 背景图像：选择一张图片作为浏览器窗口的背景。

3. 在特定网站启用暗模式：

Chrome 也允许你在特定网站启用暗模式。
打开你想启用暗模式的网站，点击地址栏右端的 "锁" 图标。
选择 "网站设置"，然后在 "外观" 部分选择 "深色" 主题。

暗模式的优势

1. 视觉舒适：

暗模式降低了屏幕亮度，减少了蓝光照射，从而减轻眼睛疲劳，特别是在夜间或低光照条件下。

2. 节能：

降低屏幕亮度有助于延长设备续航时间，这对于使用笔记本电脑或其他便携式设备的人来说非常有益。

3. 保护隐私：

在公共场合，暗模式降低了屏幕亮度，使得屏幕内容不易被他人窥视，保护了用户隐私。

代码示例

以下代码示例演示了如何在 JavaScript 中实现暗模式：

// 检查是否支持暗模式
if (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
  // 开启暗模式
  document.body.classList.add('dark-mode');
} else {
  // 保持浅色模式
  document.body.classList.remove('dark-mode');
}