All TalkersCode Topics

Follow TalkersCode On Social Media

devloprr.com - A Social Media Network for developers Join Now ➔

HTML Radio Button Checked

Last Updated : Mar 11, 2024

HTML Radio Button Checked

In this tutorial we will show you the solution of HTML radio button checked, in html, as we know there are many input types that are used in form tag and one of them is radio buttons. The radio buttons are radio in shape followed by some text.

They are different from the check boxes as, at one time you are able to mark as much as check boxes available but in case of radio buttons, you are able to click one at a time, no matters how many radios are available.

Our, today topic is to make a radio button checked or marked by default.

Step By Step Guide On HTML Radio Button Checked :-

As, many developers come with a problem that how we are able to make a radio buttons which are already marked or checked when the html page loads or also by default if we want to say.

So, today we will show you an example in html that how it is done. You are also able to mark or check any radio button after you understand the below codes.

<!DOCTYPE html>
      <html>
        <head>
          <title> Title of the document<title>
	  </head>
	  <body>
    Here You have to select the age range in which you lie :
    <form action="">
        <input type="radio" name="age" id="one"> 01-20
        <input type="radio" name="age" id="two" checked > 20-40
        <input type="radio" name="age" id="three"> 40-60
        <input type="radio" name="age" id="four"> 60-80
        <input type="radio" name="age" id="five"> 80 or more
    </form>
	</body>
      </html>
  1. First, we write <! DOCTYPE html> which we used as an instruction to the web browser about what version of HTML file is written in.
  2. Secondly, the <html> tag is used to indicate the beginning of an HTML document.
  3. As above now <head> tag is used to contain information about web page. In this tag a <title> tag is used which helps us to specify a webpage title. Both <head> and <title> tags are Paired tags. So, both have </head> and </title> ending tags respectively.
  4. Thirdly, <body> tag is used to define the webpage body. All the contents to show on website are written here.
  5. In the body tag, here we will show you an example in which we use form tag. You are able to make form tags as much as you want.
  6. After this we make input tags with type radio to show them radio buttons on browser. The value must be same on all the input tags, so that when at one time only one radio button gets clicked.
  7. After this the main thing is to make a radio checked. For this we add an attribute checked to make a radio button checked with no any additional value.
  8. You are able to use checked attribute in any input tag with radio type. in which you want to make a radio button clicked default, when you open codes on browser.
  9. At last, the <body> and <html> tags are closed with </body> and </html> respectively.

Conclusion :-

In conclusion, you can use radio button anywhere in body of html page. After this we have to use checked attribute in the input tag, in we want to make a radio button automatically clicked. I hope this tutorial on HTML radio button checked helps you.