HTML DROPDOWN LIST with programming examples.

Published by StudyMuch on

StudyWave Dropdown List

HTML TUTORIAL N0:12

HTML DROPDOWN LIST

A HTML Dropdown List is an inline element, it is control that provides a menu of options.

It uses any element to open the dropdown menu, HTML dropdown is a list of options, we can also see menu navigation of any website.

In HTML Dropdown List, the <select> element defines an HTML dropdown list.

It should enclose multiple <option> element with the value attribute for each.

HTML Dropdown List Attributes

multiple: If we use ‘multiple’ attributes in HTML Dropdown List, then the user can select multiple values from the dropdown list. This attribute does not require a value, it only needs to be present at the start tag.

Examples of HTML Dropdown List

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible"
content="IE=edge">
    <meta name="viewport"
content="width=device-width,
initial-scale=1.0">
    <title>Dropdown List</title>
</head>
<body>
 <select name="Dropdown" id="sample">
     <option value="">Home</option>
     <option value="">Privacy Polacy</option>
     <option value="">Desclamir</option>
     <option value="">Sitemap</option>
     <option value="">About Us</option>
     <option value="">contact Us</option>
 </select>
</body>
</html>

Output of HTML Dropdown List

Multiple Option Allowed

Here we see the example of ‘multiple’ attributes, when we use multiple attributes in HTML Dropdown List, it shows multiple content in one time. As you can show in below example of multiple attributes.

Example of Multiple Attributes

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible"
content="IE=edge">
    <meta name="viewport"
content="width=device-width,
initial-scale=1.0">
    <title>Dropdown List</title>
</head>
<body>
 <select name="Dropdown"
id="sample" multiple>
     <option value="">Home</option>
     <option value="">Privacy Polacy</option>
     <option value="">Desclamir</option>
     <option value="">Sitemap</option>
     <option value="">About Us</option>
     <option value="">contact Us</option>
 </select>
</body>
</html>

Output of above Example

In this tutorial we learned HTML Dropdown List with multiple attributes, and in next tutorial we will learn a new topic in HTML. I hope you understand this tutorial, If you have any question you ask in comment box.

Also Read This-


6 Comments

litter · September 11, 2022 at 2:01 am

І know this if off topic but I’m looking into startіng my own ᴡeblog
and was curious what all is needed to get setup?
I’m assᥙming having a Ьlog like youгs would cost a pretty penny?

I’m not very web savvy so I’m not 100% sure. Any recommendations or adѵice would be greatly appreciated.

Kudos

zoritoler imol · November 2, 2022 at 12:04 pm

I believe other website proprietors should take this website as an model, very clean and excellent user genial pattern.

Quintin Davanzo · January 16, 2023 at 9:32 am

As a Newbie, I am always searching online for articles that can be of assistance to me. Thank you

bingo plus · August 13, 2023 at 11:32 am

Fantastic beat ! I wish to apprentice while you amend your website, how could i subscribe for a blog website? The account helped me a acceptable deal. I had been a little bit acquainted of this your broadcast offered bright clear idea

Psychic Parties · August 13, 2023 at 1:02 pm

I am not sure where you’re getting your info, but great topic. I needs to spend some time learning much more or understanding more. Thanks for magnificent information I was looking for this info for my mission.

20bet · September 16, 2023 at 3:03 pm

Your article gave me a lot of inspiration, I hope you can explain your point of view in more detail, because I have some doubts, thank you.

Leave a Reply

Avatar placeholder

Your email address will not be published. Required fields are marked *