【css】一行 CSS 为网页添加暗黑模式支持

现在仅需增加以下一行魔法 CSS：

html[theme='dark-mode'] {
    filter: invert(1) hue-rotate(180deg);
}

这个方法的唯一缺点是，它还会反转应用程序中的所有图像。

因此，我们将对所有图像添加相同的规则，以逆转效果。

html[theme='dark-mode'] img{
    filter: invert(1) hue-rotate(180deg);
}

我们还将向HTML元素添加一个 transition ，以确保过渡不会过于花哨!

html {
    transition: color 300ms, background-color 300ms;
}