我的网页设计有问题:我希望在激活特定单选按钮时打开内容框
input#topic1:checked ~ #content1{
color:yellow;
}
但是没有任何反应。其余代码在 this 中jsfiddle。我敢打赌答案真的很简单,但我尝试了很多,但没有找到任何可以回答这个问题的问题。
谢谢你的努力
蒂姆
最佳答案
问题是 ~
选择器与共享同一父级的兄弟一起工作,在您的情况下,父级是 body
但内容 div 在 label 内
,所以你应该这样定位它:
input#topic1:checked ~ label #content1 {
color: yellow;
}
input#topic2:checked ~ label #content2 {
color: yellow;
}
input#topic3:checked ~ label #content3 {
color: yellow;
}
参见 jsFiddle 分支:https://jsfiddle.net/azizn/k8gxzq56/
关于html - CSS 单选框什么都不做,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35901386/