Select and Action are one of the most important tags in HTML and one cannot create a DropDown Menu and not use it. Let’s start our journey of select and option tag in HTML in the following manner:
- What is Select and Option Tag in HTML?
- Example of Select Tag in HTML
- List of Attributes of Select Tag
- Example of Option Tag in HTML
- List of Attributes of Option Tag
What is Select and Option Tag in HTML?
The <select> tag is used within a form for defining a select list in HTML. Which appears when clicking on the form element and it proceeds the user to select one of the options.
The <option> tag within the select element is defining the available option in the list. <option>tag is used to define all possible options to select from.
Example of Select Tag in HTML
<!DOCTYPE html> <html> <head> <title>HTML select tag </title> </head> <body> <form action="/cgi-bin/dropdown.cgi" method="post"> <select name="dropdown"> <option value="html" selected>html</option> <option value="css" selected>css</option> <option value="php" selected>php</option> </select> <input type="submit" value="submit" /> </form> </body> </html>
Output:
<option value="css" selected>css</option>
This option tag is tag can be used to give any number drop down options. The subject in this field can be altered according to the requirement.
List of Attributes of Select Tag
Example of Option Tag in HTML
<!DOCTYPE html> <html> <head> <title>HTML option tag </title> </head> <body> <form action="/cgi-bin/dropdown.cgi" method="post"> <select name="dropdown"> <option value="physicsl" selected>physicsl</option> <option value=”chemistry”selected>chemistry</option> <option value="maths" selected>maths</option> </select> <input type="submit" value="submit" /> </form> </body> </html>
List of Attributes of Option Tag
Attribute | Description |
Value | This value will be used if an option in the select box is selected. |
Selected | Specifies this option should be firstly selected value when the page loads. |
Lable | It is an alternative way of labeling options. |
With this, we come to an end of this Select and Option Tag in HTML article. I hope you understood the importance of Select and Option tag in HTML.
Check out our Full Stack Web Developer Masters Program which comes with instructor-led live training and real-life project experience. This training makes you proficient in skills to work with back-end and front-end web technologies. It includes training on Web Development, jQuery, Angular, NodeJS, ExpressJS, and MongoDB. Learn how to create mobile apps that users love using Flutter by joining a Flutter Course.
Got a question for us? Please mention it in the comments section of “Select & Option Tag in HTML” blog and we will get back to you.