HTML

Last Updated: 10/5/2022

select - Drop down list

  • Used to create a drop-down list.

Multiple

Specifies that multiple options can be selected at once

<select multiple>
	<option value="html">HTML</option>
    <option value="css">CSS</option>
    <option value="aspnet">ASP.NET</option>
    <option value="nodejs">Node JS</option>
</select>

Size

Defines the number of visible options in a drop-down list

<select size="3">
	<option value="html">HTML</option>
    <option value="css">CSS</option>
    <option value="aspnet">ASP.NET</option>
    <option value="nodejs">Node JS</option>
</select>

Optgroup

  • Used to group related options
  • Use label attribute to specify the group name
  • Can't select optgroup
<label for="technologies">Choose Technologies:</label>
<select name="technologies" id="technologies">
  <optgroup label="Front End">
    <option value="html">HTML</option>
    <option value="css">CSS</option>
  </optgroup>
  <optgroup label="Back End">
    <option value="aspnet">ASP.NET</option>
    <option value="nodejs">Node JS</option>
  </optgroup>
</select>

Empty Option

<select required>
<option value="">Select Country</option>
<option>India</option>
<option>Paskistan</option>
<option>Srilanka</option>
</select>

Selected Option

Single Selection
<select>
	<option value="html">HTML</option>
    <option value="css">CSS</option>
    <option value="aspnet" selected>ASP.NET</option>
    <option value="nodejs">Node JS</option>
</select>

Multiple Selection
<select multiple>
	<option value="html">HTML</option>
    <option value="css">CSS</option>
    <option value="aspnet" selected>ASP.NET</option>
    <option value="nodejs" selected>Node JS</option>
</select>