prefers-color-scheme与深色模式识别实例页面

展示

当前模式是：

代码

HTML：
```
<p>当前模式是：</p>
```

CSS：

p::after {
    content: "浅色";
}
@media (prefers-color-scheme: dark) {
    body { 
        filter: invert(1) hue-rotate(180deg);
        background-color: #000;
    }
    img {
        filter: invert(1) hue-rotate(180deg);
    }
    p::after {
        content: "深色";
    }
}