Back to home
Multiple select menus and keyboard use
Operation
- TAB to focus on select menu
- Focus appears on select menu
- Right and down ARROW keys move to next option, back and up ARROW keys move to previous option.
- SHIFT to multi-select items.
Example
Code sample
<form class="example" action="#">
<div>
<label for="color">Favourite color</label>
<select id="color" name="color" multiple>
<option>Amaranth</option>
<option>Amber</option>
<option>Amethyst</option>
<option>Apricot</option>
<option>Aquamarine</option>
<option>Azure</option>
<option>Baby blue</option>
<option>Beige</option>
<option>Black</option>
<option>Blue</option>
<option>Blue-green</option>
<option>Blue-violet</option>
</select>
</div>
</form>
Bottom of page - Back to home