HTML <input> Tag with 'type=checkbox'

<form name="myForm" action="http://www.PuStudy.Com/html-solution/resources/html-forms-action.html">
	
<input type="checkbox" name="Checkbox1">
<input type="checkbox" name="Checkbox2">
<input type="checkbox" name="Checkbox3">

<button>Submit</button>
</form>

The above example demonstrates usage of the <input> element with the type attribute set to checkbox (i.e. type="checkbox").

The checkbox value allows you to provide a checkbox for the user to select from. The official HTML5 specification puts it this way:

represents a two-state control that represents the element's checkedness state. If the element's checkedness state is true, the control represents a positive selection, and if it is false, a negative selection. If the element's indeterminate IDL attribute is set to true, then the control's selection should be obscured as if the control was in a third, indeterminate, state.

Basically, if the user selects the checkbox, the field will be submitted with the form. It's value will be on. If the user doesn't select the checkbox, the field will not be submitted with the form.

The checked Attribute

You can use the checked attribute to have a checkbox already checked when the page loads. Like this:

<form name="myForm2" action="http://www.PuStudy.Com/resources/html-forms-action.html">
	
<input type="checkbox" name="Checkbox1">
<input type="checkbox" name="Checkbox2" checked>
<input type="checkbox" name="Checkbox3">

<button>Submit</button>
</form>

The checked attribute is a boolean attribute. If the attribute is present, its value must either be the empty string or a value that is an ASCII case-insensitive match for the attribute's canonical name, with no leading or trailing whitespace (i.e. either checked or checked="checked").

Possible values:

  • [Empty string]
  • checked