我有以下代码:
<!doctype html>
<html>
<head>
</head>
<body>
<div id="color-wrapper">
Hello world
</div>
<input id="dark-mode" type="checkbox">
<label for="dark-mode">Dark mode</label>
</body>
<style>
:root {
--bg: pink;
}
#dark-mode:checked ~ #color-wrapper {
--bg: orange;
}
#color-wrapper {
background: var(--bg);
}
</style>
</html>
它必须更改"Hello world"文本的背景 colored颜色 ,然后我选中复选框,但它不会, colored颜色 始终是粉色.有什么问题吗?