Html form

Learn html form codes and tags using the sample below.

Html form

FORM

CODE

<FORM ACTION="javascript:void(0)" METHOD="POST">

  This is a form.<BR>

  <FIELDSET>

    <LEGEND ALIGN="TOP">This is the legend of fieldset one</LEGEND> 

	

    <INPUT TYPE="RADIO" NAME="radio" VALUE="radio1" ID="r1">

      <LABEL FOR="r1">Radio 1</LABEL> 

    <INPUT TYPE="RADIO" NAME="radio" VALUE="radio1" ID="r2">

      <LABEL FOR="r2">Radio 2</LABEL> 

    <INPUT TYPE="RADIO" NAME="radio" VALUE="radio1" ID="r3">

      <LABEL FOR="r3">Radio 3</LABEL> <BR>

		

    <INPUT TYPE="CHECKBOX" NAME="cbox1" VALUE="checkbox1" ID="c1">

      <LABEL FOR="c1">Checkbox 1</LABEL> 

    <INPUT TYPE="CHECKBOX" NAME="cbox2" VALUE="checkbox2" ID="c2">

      <LABEL FOR="c2">Checkbox 2</LABEL> 

    <INPUT TYPE="CHECKBOX" NAME="cbox3" VALUE="checkbox3" ID="c3">

      <LABEL FOR="c3">Checkbox 3</LABEL><BR>

  </FIELDSET>

  

  <FIELDSET> 

    <LEGEND ALIGN="TOP">This is the legend of fieldset two</LEGEND> 

    <INPUT TYPE="TEXT" NAME="text" VALUE="Text">  

    <INPUT TYPE="PASSWORD" NAME="passwd" VALUE="password"> <BR>

    <INPUT TYPE="FILE" NAME="file" VALUE="file"><BR>

  </FIELDSET>   

  <FIELDSET> 

    <LEGEND ALIGN="TOP">This is the legend of fieldset three</LEGEND>

    <SELECT NAME="select">

      <OPTION VALUE="selection1">Selection 1 

      <OPTION VALUE="selection2">Selection 2 

      <OPTION VALUE="selection3">Selection 3

    </SELECT>

    <SELECT NAME="select2">

      <OPTION>selection1

      <OPTION>selection2

      <OPTION>selection3

    </SELECT><BR>

  </FIELDSET>

    <TEXTAREA NAME="textarea" COLS="30" ROWS="3">

        This is a textarea

    </TEXTAREA><BR>

    <INPUT TYPE="SUBMIT"> 

    <INPUT TYPE="RESET"> 

    <INPUT TYPE="BUTTON" NAME="button" VALUE="Button">

  </FORM>

BROWSER

Html form source code


<FONT SIZE=2 COLOR=#333333 FACE="Verdana, Arial"><B>
<H2>FORM</H2></B></FONT>

<TABLE BORDER="1" WIDTH="70%">

<TR>

	<TH BGCOLOR="#FFFAF0"><FONT SIZE=3 COLOR=#000000 FACE="Verdana, Arial"><B>CODE</B></FONT></TH>

</TR>

<TR>

	<TD VALIGN="TOP" WIDTH="50%">

<PRE><FORM ACTION="javascript:void(0)" METHOD="POST">

  This is a form.<BR>

  <FIELDSET>

    <LEGEND ALIGN="TOP">This is the legend of fieldset one</LEGEND> 

	

    <INPUT TYPE="RADIO" NAME="radio" VALUE="radio1" ID="r1">

      <LABEL FOR="r1">Radio 1</LABEL> 

    <INPUT TYPE="RADIO" NAME="radio" VALUE="radio1" ID="r2">

      <LABEL FOR="r2">Radio 2</LABEL> 

    <INPUT TYPE="RADIO" NAME="radio" VALUE="radio1" ID="r3">

      <LABEL FOR="r3">Radio 3</LABEL> <BR>

		

    <INPUT TYPE="CHECKBOX" NAME="cbox1" VALUE="checkbox1" ID="c1">

      <LABEL FOR="c1">Checkbox 1</LABEL> 

    <INPUT TYPE="CHECKBOX" NAME="cbox2" VALUE="checkbox2" ID="c2">

      <LABEL FOR="c2">Checkbox 2</LABEL> 

    <INPUT TYPE="CHECKBOX" NAME="cbox3" VALUE="checkbox3" ID="c3">

      <LABEL FOR="c3">Checkbox 3</LABEL><BR>

  </FIELDSET>

  

  <FIELDSET> 

    <LEGEND ALIGN="TOP">This is the legend of fieldset two</LEGEND> 

    <INPUT TYPE="TEXT" NAME="text" VALUE="Text">  

    <INPUT TYPE="PASSWORD" NAME="passwd" VALUE="password"> <BR>

    <INPUT TYPE="FILE" NAME="file" VALUE="file"><BR>

  </FIELDSET>   

  <FIELDSET> 

    <LEGEND ALIGN="TOP">This is the legend of fieldset three</LEGEND>

    <SELECT NAME="select">

      <OPTION VALUE="selection1">Selection 1 

      <OPTION VALUE="selection2">Selection 2 

      <OPTION VALUE="selection3">Selection 3

    </SELECT>

    <SELECT NAME="select2">

      <OPTION>selection1

      <OPTION>selection2

      <OPTION>selection3

    </SELECT><BR>

  </FIELDSET>

    <TEXTAREA NAME="textarea" COLS="30" ROWS="3">

        This is a textarea

    </TEXTAREA><BR>

    <INPUT TYPE="SUBMIT"> 

    <INPUT TYPE="RESET"> 

    <INPUT TYPE="BUTTON" NAME="button" VALUE="Button">

  </FORM></PRE>

	</TD>

</TR>

<TR>

	<TH BGCOLOR="#FFFAF0"><FONT SIZE=3 COLOR=#000000 FACE="Verdana, Arial"><B>BROWSER</B></FONT></TH>

</TR>

<TR>

	<TD VALIGN="TOP" WIDTH="50%">

<FORM ACTION="javascript:void(0)" METHOD="POST"> 

  This is a form.<BR>

  <FIELDSET>

    <LEGEND ALIGN="TOP">This is the legend of fieldset one</LEGEND> 

    <INPUT TYPE="RADIO" NAME="radio" VALUE="radio1" ID="r1"><LABEL FOR="r1">Radio 1</LABEL> 

    <INPUT TYPE="RADIO" NAME="radio" VALUE="radio2" ID="r2"><LABEL FOR="r2">Radio 2</LABEL> 

    <INPUT TYPE="RADIO" NAME="radio" VALUE="radio3" ID="r3"><LABEL FOR="r3">Radio 3</LABEL> <BR>

    <INPUT TYPE="CHECKBOX" NAME="cbox1" VALUE="checkbox1" ID="c1"><LABEL FOR="c1">Checkbox 1</LABEL> 

    <INPUT TYPE="CHECKBOX" NAME="cbox2" VALUE="checkbox2" ID="c2"><LABEL FOR="c2">Checkbox 2</LABEL> 

    <INPUT TYPE="CHECKBOX" NAME="cbox3" VALUE="checkbox3" ID="c3"><LABEL FOR="c3">Checkbox 3</LABEL><BR>

  </FIELDSET>

  <FIELDSET> 

    <LEGEND ALIGN="TOP">This is the legend of fieldset two</LEGEND> 

    <INPUT TYPE="TEXT" NAME="text" VALUE="text">  

    <INPUT TYPE="PASSWORD" NAME="passwd" VALUE="password"> <BR>

    <INPUT TYPE="FILE" NAME="file" VALUE="file"><BR>

  </FIELDSET>   

  <FIELDSET> 

    <LEGEND ALIGN="TOP">This is the legend of fieldset three</LEGEND>

    <SELECT NAME="select">

      <OPTION VALUE="selection1">Selection 1 

      <OPTION VALUE="selection2">Selection 2 

      <OPTION VALUE="selection3">Selection 3

    </SELECT>

    <SELECT NAME="select2">

      <OPTION>selection1 

      <OPTION>selection2

      <OPTION>selection3

    </SELECT><BR>

  </FIELDSET>

    <TEXTAREA NAME="textarea" COLS="30" ROWS="3">This is a textarea

Html form tutorial

Html form code on this is provided for your study purpose, it will guide you to know how create and design a website using html. use it to practice and train your self online

All the tutorials on this site are free, the page code is provifed for you to use it to practice, if you want to help to improve and maintain this work, you can donate to us on.

Html tutorial guide and web design in easy steps