I would like to have a series of radio buttons, whereby there are no radio buttons, only the labels and the selected "button" is indicated via a red, rounded border. This is to emulate a given paper form whereby a value is indicated by circling a single number.
Is this possible?
No scripting needed. Just CSS.
Here's a fiddle: JSFiddle
I don't know exactly what you want, but this is at least proof of concept.
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>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.