САМОСТОЯТЕЛЬНОЕ ОБУЧЕНИЕ ДЛЯ ВЕБ РАЗРАБОТЧИКОВ

На сайте нет рекламы

HTML Тег <select>



Пример

Создайте раскрывающийся список с четырьмя вариантами:

<label for="cars">Выберите автомобиль:</label>

<select name="cars" id="cars">
  <option value="volvo">Вольво</option>
  <option value="saab">Сааб</option>
  <option value="mercedes">Мерседес</option>
  <option value="audi">Ауди</option>
</select>
Попробуйте сами »

Определение и использование

Тег <select> используется для создания выпадающего списка.

Тег <select> чаще всего используется в форме, чтобы собрать пользовательский ввод.

Атрибут name необходим для ссылки на данные формы после отправки формы (если вы опустите атрибут name, никакие данные из выпадающего списка не будут представлены).

Атрибут id необходим для того, чтобы связать выпадающий список с меткой.

Тег <option> внутри элемента <select> определяет доступные параметры в раскрывающемся списке.

Совет: Всегда добавляйте тег <label> для лучших практик доступности!


Поддержка браузеров

Элемент
<select> Да Да Да Да Да


Атрибуты

Атрибут Значение Описание
autofocus autofocus Указывает, что раскрывающийся список должен автоматически фокусироваться при загрузке страницы
disabled disabled Указывает, что раскрывающийся список должен быть отключен
form form_id Определяет, к какой форме относится раскрывающийся список
multiple multiple Указывает, что одновременно можно выбрать несколько параметров
name name Определяет имя раскрывающегося списка
required required Указывает, что пользователь должен выбрать значение перед отправкой формы
size number Определяет количество видимых параметров в раскрывающемся списке

Глобальные атрибуты

Тег <select> также поддерживает Глобальные атрибуты в HTML.


События атрибутов

Тег <select> также поддерживает События атрибутов в HTML.


Еще примеры

Пример

Use <select> with <optgroup> tags:

<label for="cars">Выберите автомобиль:</label>
<select name="cars" id="cars">
  <optgroup label="Шведские Автомобили">
    <option value="volvo">Вольво</option>
    <option value="saab">Сааб</option>
  </optgroup>
  <optgroup label="Немецкие Автомобили">
    <option value="mercedes">Мерседес</option>
    <option value="audi">Ауди</option>
  </optgroup>
</select>
Попробуйте сами »

Связанные страницы

HTML DOM Справочник: Объект Select

CSS Учебник: Стили форм


Настройки CSS по умолчанию

Нет.