HTML · справочник
Теги select и option
select предлагает выбрать один или несколько заранее известных вариантов. Каждый вариант записывается через option.
Одиночный выбор
Добавь select атрибут name, чтобы значение отправлялось вместе с формой. В value хранится машинное значение, а внутри option — понятная подпись.
<label for="level">Уровень</label>
<select id="level" name="level">
<option value="beginner">Начинающий</option>
<option value="advanced">Продвинутый</option>
</select>Подсказка и группы
Первый disabled-вариант может служить просьбой выбрать значение. Связанные варианты объединяются через optgroup с подписью label.
<select name="course" required>
<option value="" selected disabled>Выберите курс</option>
<optgroup label="Вёрстка">
<option value="html">HTML</option>
<option value="css">CSS</option>
</optgroup>
</select>Частые ошибки
- Select без label.
- Option без value при нестабильном тексте.
- Слишком длинный список без поиска.
- Multiple без объяснения способа выбора.
Практика
Создай выбор направления обучения с группами «Основа» и «Фреймворки». Добавь обязательную подсказку и проверь отправляемое значение.