神奇的 @media (prefers-color-scheme: dark)
夜间模式已经实现很久了,当初有人跟我讲,可以增加一个按时间切换的功能。
直到我在无意间查看 Reabble 阅读器的 CSS 样式时,发现了 @media (prefers-color-scheme: dark)
选择器。
来自:prefers-color-scheme - CSS(层叠样式表) | MDN
prefers-color-scheme CSS 媒体特性用于检测用户是否有将系统的主题色设置为亮色或者暗色。
简而言之,就是可以实现随系统(或浏览器)的深、浅色模式设置,改变网页配色。
我觉得这是比按时间切换更好的一个实现,跟随系统设置比跟随时间更加人性化一些,毕竟还有我这种,白天开深色,晚上开浅色的异类(逃)
神奇的 @media (prefers-color-scheme: dark)