How to Create Radio Buttons in HTML

Last Updated: June 3, 2021

Radio boxes for HTML forms are really easy to use, but trying to create radio boxes when coding can be a tough thing to master. This article will help you create these buttons in your HTML code.

Steps

1
Construct an HTML document up to and including the <form> tag. Make sure that you've placed this tag inside of the body of the HTML sheet (much like any other web form that is created.
2
Type the <input type="radio"> tag to place the radio box.

Advertisement
3
Designate a value that will explain to the browser that this group of radio boxes all belong together. Add the value= attribute to the input tag that was previously added. Use the same value= name to keep them together until you want to restate a new grouping of choices.
4
Define a name to the value to explain just which selection was checked inside the group with the name attribute of the HTML form..Finish off the input HTML tag with a tag that looks like <input type="radio" value="group1" name="> to designate whether the checkbox for an inside selection (from a later label) was checked.
5
Designate what you want this radio box to be for. Make sure the value you place inside the input value corresponds to what you named your parenthesis value to be. ^{[1]
X
Research source}
6
Repeat from designating a new <input> HTML tag/value set until all values are entered for that group are entered into the document.
7
Close the form after all input fields are entered with a final </form> tag.
8
End the HTML document with a </body> followed by the </html> HTML tags.
9
Save and verify your newly-produced web form's radio buttons in your web browser.