Html页面支持暗黑模式的实现

自19年开始,Android和IOS平台,都开始玩暗黑模式。当然这没什么不好,但是当我们的页面被用户在暗黑模式打开之后,会被那传统大白色瞬间闪瞎双眼。 下面会简单的说一下如何让页面支持暗黑模式。 准备 其实,我们只是需要使用到css中的 prefers-color-scheme 媒体查询。 no-preference 表示用户未制定操作系统主题。作为布尔值时,为 false 输出。 light 表示用户的操作系统是浅色主题。 dark 表示用户的操作系统是深色主题。 说明 这篇文章发布的时候,微信还无法拿到 prefers-color-scheme 参数,