HTML Drop Down or multiple selection lists:

Drop Down multiple selection lists: In HTML drop down lists or multiple selection lists can be used in a variety of ways e.g. some use these lists for menu items while the most fitting purpose of these lists remains for restricting user input both for accuracy and standardizing. Selection lists do help in making things look nice while they might have raw data in the backend. A sample code for the Selection List or drop down list is shown below:

Selection List Sample Code

<label>When do you go for jogging?</label>         <select id = “jogging”>           <option value = “morning”>Morning</option>           <option value = “evening”>Evening</option>           <option value = “afternoon”>Afternoon</option>           <option value = “sunday”>Sundays</option>           <option value = “weekdays”>Weekdays</option>           <option value = “holidays”>Holidays</option>           <option value = “never”>Never</option>         </select>

 

The above code gives the below output:

How to build a selection list step by step:

Step 1: Add a label to your list; it is an optional field. Let us add one to our list:

<label> My first Selection List</label>

Step 2: Initiate the selection tags:

<select> </select>

Step 3: let’s add some values to the list that shall drop down upon user click:

<option value = “1^st option”> Option 1</option>

<option value = “2^nd option”> Option 2</option>

<option value = “3^rd option”> Option 3</option>

 

Let us put our code in some browser and see what happens:

That’s it. We got our very first selection list working.