单选按钮选择器CSS仅限pls

我已经创建了一个css图像滑块与单选按钮来控制它。我已将单选按钮设置为“可见性：隐藏”，并且正在使用标签的缩略图。html的外观如下所示：

<div class="slider">
<input type="radio" value="navy" id="colour" name="attribute_colour" >
<label for="navy">
<img src="uploads/navy.png">
</label> 

但是没有用！我尝试过许多类似的选择，我对jquery一无所知，所以css解决方案将非常有用。

1）定位元素需要位置：相对或位置：绝对
2） 使用百分比值需要设置父容器的高度（对于一个200px）
3） 属性的标签引用的是输入id，而不是值

---

试试看。

谢谢你的回复。第1）点和第2）点处于正常工作状态（最初为简洁起见省略），但第3）点除外！我已经尝试了

.insidecover输入[type=radio]：checked+label[value=navy]~.insidecovermain>ul{top:-100%；}

和

.insidecover输入[type=radio]：checked+label[value=“navy”]~.insidecovermain>ul{top:-100%；}

我可能缺少什么？对不起，代码的意思是：

。滑块输入[type=radio]：checked+label[value=navy]~.slidermain>ul{top:-100%；}

和

滑块输入[type=radio]：选中+label[value=“navy”]~.slidermain>ul{top:-100%；}

我可能缺少什么？实际上它是label[for=“navy”]，而不是value

<div class="slidermain"><ul>
<li>
<img src="uploads/navyfullsize.png">
</li>

</ul></div></div>`

.slider input[type=radio]:checked + label[for=navy]~.slidermain>ul  
{ top:-100%; }