在纯CSS中单击单选按钮时隐藏一组图像

我试图在纯CSS中打开/关闭单选按钮时隐藏/显示一组图像

有4个单选按钮与此类似（带有第二组按钮等）：

然而，它根本不起作用，没有任何东西按预期显示/隐藏

有人知道如何解决这个问题吗

谢谢， Seb

input#firstSet:选中~#images>.firstSet{
显示：块；
}
输入#第二集：选中~#图像>.firstset，输入#第三集：选中~.firstset{
显示：无；
}

第一套

input#firstSet:选中~#images>.firstSet{
显示：块；
}
输入#第二集：选中~#图像>.firstset，输入#第三集：选中~.firstset{
显示：无；
}

第一套

<input type="radio" name="imagetest" id="firstSet"><label for="firstSet" id="firstSet">First Set</label>

<div id="images">
<img src="images/01.jpg" class="firstset">
<img src="images/02.jpg" class="firstset">
<img src="images/03.jpg" class="secondset">
<img src="images/04.jpg" class="secondset">
<img src="images/05.jpg" class="thirdset">
<img src="images/06.jpg" class="firstset">
</div>

input#firstSet:checked ~ .firstset {
display: block;
}
input#secondSet:checked ~ .firstset, input#thirdSet:checked ~ .firstset {
display: none;
}