요즘 다음 뉴스도 적용되었길레 조사해봤음.
prefers-color-scheme 값은 light와 dark 만 가질 수 있다.
나머지 다른 값들은 무시됨.
.themed {
display: block;
width: 10em;
height: 10em;
background: black;
color: white;
}
/* light 모드일 때의 스타일 재선언 */
@media (prefers-color-scheme: light) {
.themed {
background: white;
color: black;
}
}
/* dark 모드일 때의 스타일 재선언 */
@media (prefers-color-scheme: dark) {
.themed {
background: black;
color: white;
}
}
chrome 76부터 지원
사파리 12.1 부터 지원
IOS 사파리 13 부터 지원