我正在尝试在没有JavaScript且只有单选按钮的情况下实现显示/隐藏结果。
我已经设法做到这一点：
<label for="show"><span>show</span></label>
<input type=radio id="show" name="group">
<label for="hide"><span>hide</span></label>
<input type=radio id="hide" name="group">
<span id="content">Content</span>
input {
display:none;
}
span#content {
display:none;
}
input#show:checked ~ span#content {
display:block;
}
input#hide:checked ~ span#content {
display:none;
}
我现在想做的是在每次“显示”和“隐藏”按钮处于活动状态时将其隐藏。因此，它需要从隐藏的内容开始，仅具有“显示”按钮，当您单击它以显示内容时，隐藏“显示”按钮并向您显示“隐藏”按钮。
没有Java，这可能吗？
谢谢！
将标签标签同时放置在输入标签中。像下面
<input type=radio id="show" name="group">
<input checked type=radio id="hide" name="group">
<label id="id1" for="show"><span id="id1">show</span></label>
<label id="id2" for="hide"><span id="id2">hide</span></label>
<span id="content">Content</span>
将这些CSS规则添加到现有规则中
input#show:checked ~ label#id1{
display:none;
}
input#show:checked ~ label#id2{
display:block;
}
input#hide:checked ~ label#id2{
display:none;
}
input#hide:checked ~ label#id1{
display:block;
}
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句