Use a Simple Drop Down List in HTML Forms

With HTML, you can create a simple drop-down list of items to get user input in HTML forms. A select box also called drop-down box provides an option to list down various options in the form of drop-down list, from where a user can select one or more options. The <select> tag is used to create a drop-down list in HTML, with the <option> tag.

Here’s the list of attributes of <select> tag:

Sr.No
 Attribute & Description
1
 Name
Used to give a name to the control which is sent to the server to be recognized and get the value.
2
 Size
This can be used to present a scrolling list box.
3
 Multiple
If set to "multiple" then allows a user to select multiple items from the menu.


Here’s the list of attributes of <option> tag:

Sr.No
 Attribute & Description
1
 Value
The value that will be used if an option in the select box is selected.
2
 Selected
Specifies that this option should be the initially selected value when the page loads.
3
 Label
An alternative way of labeling options.


Example

You can try to run the following to create a simple drop-down list of items to get user input in HTML forms:

Live Demo

<!DOCTYPE html>
<html>
   <head>
      <title>Select Box Control</title>
   </head>
   <body>
      <p>Here's the list of subjects. Select any one:</p>
      <form>
         <select name = "dropdown">
            <option value = "Computer Architecture" selected>Computer Architecture</option>
            <option value = "Java">Java</option>
            <option value = "Discrete Mathematics">Discrete Mathematics</option>
         </select>
      </form>
   </body>
</html>
Updated on: 2020-05-12T08:16:56+05:30

11K+ Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements