Categories
Web development

HTML Radio Buttons

HTML Radio Buttons

The HTML <input type=”radio”> specifies a radio button.

Radio buttons are usually in the groups. You can select only one radio button (one option) at the same time.

Syntax:

<input type="radio">

Example:

<!DOCTYPE html>
<html>
<body>

<form action="">
  <p>Select your favourite colour:</p>
  <input type="radio" id="blue" name="colour" value="blue">
  <label for="blue">Blue</label><br>
  <input type="radio" id="pink" name="colour" value="pink">
  <label for="pink">Pink</label><br>
  <input type="radio" id="yellow"name="colour" value="yellow">
  <label for="yellow">Yellow</label><br>
  <input type="radio" id="other" name="colour" value="other">
  <label for="other">Other</label>
</form>

</body>
</html>

Output:

Note: Always add the <label> tag.

Click here to see how to style the HTML Radio buttons using CSS.

Enjoy coding!

Read also:

HTML Checkbox

CSS :checked Selector