替代无线电输入

我建议用户使用单选按钮来识别这些输入,它将在没有javascript的情况下工作。

<form>
<input type="radio" name="sex" value="male" id="male"/><label for="male">Male</label>
<br />
<input type="radio" name="sex" value="female" id="female" /> <label for="female">Female</label>
</form>

然后您可以将图像放在标签中,或者更好地说,放在背景图像中以补充文本。

当然,对每个图像做两个变体(正常和突出显示),并使用javascript记住选中的是哪个,然后切换图像。

图像旁边的单选按钮怎么样?然后使用javascript隐藏单选按钮,并在单击图像时更改(隐藏)选定的单选按钮。再加上对所选图像的某种高亮度效果,你就有了一个有吸引力的界面,它会很好地降低质量。jquery或类似的javascript库将有助于实现这一点。