javascript - 如何检测我的网站是否启用了深色模式？

Question

如何检测我网站的用户是否使用 macOS/Windows 并使用 JavaScript 或 CSS 启用深色模式？这可能吗？

Answer 1

现在这成为可能，因为 WebKit 添加了对 prefers-color-scheme CSS 媒体查询的支持。你可以像这样使用它:

@media (prefers-color-scheme: dark) { 
    body { background: black; }
}

或者在 JavaScript 中:

function isDarkModeEnabled() {
    return window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches
}

阅读更多关于 Dark Mode Support in WebKit 的信息.这从 Safari 12.1 开始可用，请参阅 Can I use...有关浏览器支持的最新信息。