HTML Select placeholder

If a select element has

  • a required attribute specified
  • does not have a multiple attribute specified
  • has a display size of 1

AND

  • if the value of the first option element in the select element’s list of options (if any) is the empty string
  • that option element’s parent node is the select element (and not an optgroup element)

then that option is the select element’s placeholder label option.

This means that according to spec, this is the official way to make a placeholder for a SELECT list

<select required>
  <option selected disabled value="">Select option</option>
  <option>Option 1</option>
  <option>Option 2</option>
</select>

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.