To achieve the list as dropdown list shown below -
we can use optgroup tag mentioned below-
<form action="/action_page.php">
<label for="skills">Choose a Skill:</label>
<select name="skills" id="skills">
<optgroup label="FrontEnd">
<option value="Angular">Angular</option>
<option value="React">React</option>
</optgroup>
<optgroup label="Backend">
<option value="Java">Java</option>
<option value="PHP">PHP</option>
</optgroup>
</select>
<br><br>
<input type="submit" value="Submit">
</form>
Demo
Conclusion
The <optgroup> tag is used to group related options in a element (drop-down list).
If you have a long list of options, groups of related options are easier to handle for a user.
With all that being said, I highly recommend you keep learning!
Thank you for reading this article. Please feel free to connect with me on LinkedIn and Twitter.
Top comments (1)
Nice. I'd never heard of the optgroup tag. I'll have to use it next time I'm coding a dropdown menu.