<select>

<select> presents a list of options. A conventional select defaults to a single-choice control. Use a visible label.

A working example

<form action="#">
  <label for="topic">Topic</label
  ><select id="topic" name="topic" required>
    <option value="">Choose a topic</option>
    <option value="html">HTML</option>
    <option value="css">CSS</option></select
  ><button type="submit">Check selection</button>
</form>

/* Optional presentation */
label {
  display: block;
  margin: 0.75rem 0 0.25rem;
}
input,
select,
textarea,
button {
  font: inherit;
  max-width: 100%;
}

Use it in a form

The empty first choice lets required validation detect that no topic was selected. Option values become the submitted value under the select’s name. multiple allows several selections; size influences the number of visible options.

Common mistakes and accessibility

Keyboard behavior and popup appearance vary by platform. Test arrow keys and selection on your target devices. A multi-select often needs extra instructions. disabled controls are not submitted. Customizable select features have separate support requirements; this example uses ordinary native behavior.

Continue with option for the related behavior.

Sources and browser support

MDN: select describes the syntax and links to the specification and compatibility data. Check individual values in that table when supporting older browsers.