ptefers-color-scheme属性
媒体查询特性,用于检测系统主题为暗黑或者亮色
语法
- no-preference:未设置或者不支持
- light:系统使用浅色主题
- dark:系统使用暗色主题
样例
@media (prefers-color-scheme: dark) {
.day.dark-scheme { background: #333; color: white; }
.night.dark-scheme { background: black; color: #ddd; }
}
@media (prefers-color-scheme: light) { .
day.light-scheme { background: white; color: #555; }
.night.light-scheme { background: #eee; color: black; }
}