Главная HTML Форма Элемент optgroup

Элемент формы <optgroup>

Элементы формы

Элемент <optgroup> (от англ. option group — группа вариантов) представляет собой контейнер, внутри которого располагаются элементы <option>, объединённые в одну группу. Особенностью <optgroup> является то, что он не выделяется как обычный элемент списка, а выделяется с помощью жирного начертания, и все элементы, входящие в этот контейнер, смещаются вправо от своего исходного положения.

Синтаксис:
<select>
<optgroup label="текст">
   <option>...</option>
</optgroup> 
</select>

Атрибуты <optgroup>

Атрибут Значение Описание
disabled disabled Блокирует доступ к группе списка, при этом группа отображается другим цветом (обычно серым) и не доступна для выбора.

<optgroup disabled>...</optgroup>

label ="text" Текст, который будет входить в список в виде заголовка группы.

<optgroup label="текст">...</optgroup>



<form action="test.php">
<select>
  <option value="" hidden>Выберите: </option>
  <optgroup label="Цвет">
      <option value="c1">Красный</option>
      <option value="c2">Зеленый</option>
      <option value="c3">Синий</option>
  </optgroup>
  <optgroup label="Тон" disabled>
      <option value="s1">Светлый</option>
      <option value="s2">Темный</option>
  </optgroup>
</select> 
<input type="submit" value="Отправить">
</form>