我想要一系列单选按钮,其中没有单选按钮,只有标签和选定的“按钮”通过红色圆形边框表示。这是为了模拟给定的纸质表格,通过圈出一个数字来表示一个值。
这可能吗?
无需编写脚本。只是 CSS。
这是一个小提琴:JSFiddle
我不确切知道您想要什么,但这至少是概念证明。
CSS
label {
display: inline-block;
width: 100px;
height: 50px;
border: solid 2px red;
}
input[type="radio"] {
display:none;
}
input[type="radio"]:checked + label {
border: solid 2px green;
}
HTML
<input type="radio" id="test" name="jeff"><label for="test">Pizza</label>
<input type="radio" id="test2" name="jeff"><label for="test2">Steak</label>