我非常感谢如果你能帮助我,我试图设置样式的2个元素的基础上的输入:签入我的SCSS,但不是工作。
<div>
<input type='checkbox' id='checkbox'></input>
<label for='checkbox'>Lorem ipsum</label>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
</div>
div {
user-select: none;
input {
&:checked + label {
background: red;
}
&:checked + p {
display: block;
}
}
p {
display:none;
}
}
https://codepen.io/ricardonas/pen/xxzvydj
如果要使段落可见,则需要更新选择器。 :checked+label
表示“立即在checked元素之后获取标签”。 遵循这个逻辑,你需要针对“输入后标签后的段落”:
div {
user-select: none;
input {
&:checked + label {
background: red;
}
&:checked + label + p {
display: block;
}
}
p {
display:none;
}
}