一尘不染

更改输入[type = checkbox]上的父div:已通过CSS选中[重复]

css

我可以弄清楚如何在选中复选框时更改父div :(更改以下段落效果很好。

在Chrome中没有运气的情况下尝试了这种方法:

HTML

​<div>
    <input type="checkbox​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​" checked>
    <p>Test</p>
</div>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

CSS

div {
    background: pink;
    width: 50px;
    height:50px;
}
div + input[type=checkbox]:checked {
  background: green;
}

input[type=checkbox]:checked + p {
    background: blue;
}

阅读 264

收藏
2020-05-16

共1个答案

一尘不染

无法选择仅使用CSS的父对象(直到CSS4),因此必须使用JS。

2020-05-16