HTML - Input tag

The input tag does not need an ending tag and can have numerous attributes:

  • text
  • password
  • radio
  • checkbox
  • reset
  • submit

HTML - Text fields and passwords

I am really sure that you have certainly hear a lot of, over the time, on the Internet.

html<input type="text" /><br />
<input type="password" />

Demo


Write something in the boxes above to see the difference.

HTML - Checkboxes

Ideal for offering the user the option of selecting more than one answers

html<input type="checkbox" /> Milk<br />
<input type="checkbox" /> Water<br />
<input type="checkbox" /> Bread

Demo

Milk
Water
Bread

HTML - Radio

And I am not saying a music radio, but a small circle which offers the possibility of choosing only one answer for a single question.

html<input type="radio" /> Man<br />
<input type="radio" /> Woman

Demo

Man
Woman

HTML - Submit buttons

Here, we will have to give a value to the submit attribute, this being the text that will be shown on the generated button.

html<input type="submit" value="Submit" />
<input type="submit" value="Next step &gt;&gt;" />

Demo

HTML - Reset Buttons

Here, same as with the submit button, we will have to give a value, that will be the text that will be shown on the generated button. This button is extremely useful in cases in which the user completes the majority of the forms with wrong information.

html<input type="reset" value="Reset" />
<input type="reset" value="Delete All " />

Demo

HTML Input fields - Note

It must be specified that those forms and buttons will not fully act without the help of a php or javascript files that will execute the wanted action once one of these buttons is pressed. In the next tutorial we will go more in depth with the shown attributes and you will also show some things that we have not yet mentioned.