Radio Buttons
Let users select one option from a list with radio buttons.
Radio
The [type="radio"] attribute turns an <input> into a radio button.
Each item in a radio group should have the same [name] and a unique [value]. Selecting a radio button will deselect any other radio button with the same [name].
<label for="up">
<input type="radio" id="up" name="movie" value="up">
Up!
</label>
<label for="wall-e">
<input type="radio" id="wall-e" name="movie" value="wall-e">
WALL-E
</label>
<label for="toy-story">
<input type="radio" id="toy-story" name="movie" value="toy-story">
Toy Story
</label>Selected by Default
Include the [checked] attribute to have a radio button selected by default.
If multiple radio buttons with the same [name] have the [checked] attribute, the last element in the DOM with the attribute will be selected.
<label for="up">
<input type="radio" id="up" name="movie" value="up">
Up!
</label>
<label for="wall-e">
<input type="radio" id="wall-e" name="movie" value="wall-e" checked>
WALL-E
</label>
<label for="toy-story">
<input type="radio" id="toy-story" name="movie" value="toy-story">
Toy Story
</label>Grouping Radio Buttons
Use the <fieldset> element to label a group of radio buttons.