Sunday, 26 January 2025

How to Create Checkboxes in HTML?

A checkbox is an input element in HTML that allows users to select one or more options from a set. It is commonly used in forms where multiple selections are allowed. Each checkbox is rendered as a small square box that can be checked (selected) or unchecked (deselected). When a checkbox is selected, it returns a value when the form is submitted.

How to create Checkboxes in HTML?

Checkboxes are created using the <input> element with the type="checkbox" attribute.

 

checkbox.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Checkbox Example</title>
  </head>

  <body>
    <h1>Select the vehicles that you own</h1>
    <form action="https://httpbin.org/post" method="post">
      <label for="vehicle1">I have a bike</label>
      <input type="checkbox" id="vehicle1" name="vehicle" value="Bike" /><br>

      <label for="vehicle2">I have a car</label>
      <input type="checkbox" id="vehicle2" name="vehicle" value="Car" /><br>

      <label for="vehicle3">I have a boat</label>
      <input type="checkbox" id="vehicle3" name="vehicle" value="Boat" /><br><br>

      <input type="submit" value="Submit" />
    </form>
  </body>
</html>

 

Above snippet generate below screen.


 

 

Previous                                                    Next                                                    Home

No comments:

Post a Comment