Пример
Раскрывающийся список с четырьмя вариантами:
<label for="cars">Выберите машину:</label>
<select id="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="opel">Opel</option>
<option value="audi">Audi</option>
</select>
Попробуйте сами »
Другие примеры "Попробуйте сами" ниже.
Определение и использование
Тег <option> определяет вариант в списке выбора.
Элементы <option> располагаются внутри элементов <select>,
<optgroup>,
или <datalist>.
Примечание: Тег <option> может использоваться без каких-либо атрибутов, но
обычно требуется атрибут value (значение), который указывает, что отправляется на сервер
при отправке формы.
Совет: Если у вас длинный список вариантов, вы можете сгруппировать связанные варианты с помощью тега <optgroup>.
Поддержка браузерами
| Элемент | |||||
|---|---|---|---|---|---|
| <option> | Да | Да | Да | Да | Да |
Атрибуты
| Атрибут | Значение | Описание |
|---|---|---|
| disabled | disabled | Указывает, что вариант должен быть отключен |
| label | текст | Указывает более короткую метку для варианта |
| selected | selected | Указывает, что вариант должен быть предварительно выбран при загрузке страницы |
| value | текст | Определяет значение, которое будет отправлено на сервер |
Глобальные атрибуты
Тег <option> также поддерживает Глобальные атрибуты в HTML.
Атрибуты событий
Тег <option> также поддерживает Атрибуты событий в HTML.
Другие примеры
Пример
Использование <option> в элементе <datalist>:
<label for="browser">Выберите ваш браузер из списка:</label>
<input list="browsers" name="browser" id="browser">
<datalist id="browsers">
<option value="Edge">
<option value="Firefox">
<option value="Chrome">
<option value="Opera">
<option value="Safari">
</datalist>
Попробуйте сами »
Пример
Использование <option> в элементах <optgroup>:
<label for="cars">Выберите машину:</label>
<select id="cars">
<optgroup label="Шведские машины">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
</optgroup>
<optgroup label="Немецкие машины">
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</optgroup>
</select>
Попробуйте сами »
Связанные страницы
Справочник HTML DOM: Объект Option
Настройки CSS по умолчанию
Нет.