What is HTML Checkbox?

The checkbox is a way to allow users making multiple choices from a given set of options. For example, allowing the customers to select the color of T-shirts for placing an order.

Similarly, in shopping carts, you might have seen multi-item carts with checkboxes to let you remove after selecting one or more items.

HTML checkboxes are used in forms with <input type> element. You can include as many checkboxes as required by giving checkboxes same name.

We will show you examples of how to create one and multiple checkboxes in HTML, let us first look at the syntax.

Basic syntax of creating a checkbox

The general syntax of creating a checkbox in HTML is:

<input type=”checkbox” name=”checkbox_name” value=”checked_value”>

As you can see, the checkbox is an input type used to submit with form. The name is used to group multiple checkboxes together. While value is passed on to the submitted form where a script (PHP, Ruby on Rails, ASP.net etc.) can get selected checkboxes. That information you can save to database or use as per requirement.

Following are few examples of creating the checkboxes.

HTML single checkbox example with script

The following example uses a single checkbox in an HTML form. After checkbox is checked and you click on submit, the next page will show you checkbox checked value by using PHP script.

Experience this online

A checkbox checked example

You can use checked attribute of HTML to make checkbox pre-selected. That is when the page is loaded the checkbox is already checked. The following example shows how to use this:

Experience this online

Using multiple checkboxes in a group

The following example shows using multiple checkboxes belonging to the same group. You can select expertise in checkboxes.

Experience this online

Also see HTML form