/
index.md
62 lines (45 loc) · 4.11 KB
/
index.md
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
---
title: <optgroup>
slug: Web/HTML/Element/optgroup
---
**HTML-элемент `<optgroup>`** позволяет группировать опции, находящиеся внутри элемента {{HTMLElement("select")}}.
| [Категории контента](/ru/docs/HTML/Content_categories) | Нет |
| ------------------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Допустимый контент | Ноль или более {{HTMLElement("option")}} элементов. |
| Пропуск тегов | Открывающий тег обязателен. Закрывающий тег может быть опущен, если сразу после элемента находится следующий элемент `<optgroup>`, или если это последний элемент внутри родителя. |
| Допустимые родители | Элемент {{HTMLElement("select")}} |
| Допустимые ARIA-роли | Нет |
| DOM-интерфейс | {{domxref("HTMLOptGroupElement")}} |
> **Примечание:** Элементы optgroup не могут быть вложенными друг в друга.
## Атрибуты
Элемент `<optgroup>` допускает использование [глобальных атрибутов](/ru/docs/Web/HTML/Global_attributes).
- `disabled`
- : Если установить этот атрибут, опции, находящиеся внутри элемента станут недоступными для выбора. Часто браузеры отображают эти опции серым цветом и игнорируют срабатывающие на них события, такие как события мыши или события получения фокуса.
- `label`
- : Имя группы, которое будет отображено браузером в выпадающем списке. Этот атрибут обязателен.
## Пример
```html
<select>
<optgroup label="Группа 1">
<option>Опция 1.1</option>
</optgroup>
<optgroup label="Группа 2">
<option>Опция 2.1</option>
<option>Опция 2.2</option>
</optgroup>
<optgroup label="Группа 3" disabled>
<option>Опция 3.1</option>
<option>Опция 3.2</option>
<option>Опция 3.3</option>
</optgroup>
</select>
```
### Результат
{{EmbedLiveSample('Пример')}}
## Спецификации
{{Specifications}}
## Совместимость с браузерами
{{Compat}}
## Смотрите также
- Элементы, имеющие отношение к формам: {{HTMLElement("form")}}, {{HTMLElement("legend")}}, {{HTMLElement("label")}}, {{HTMLElement("button")}}, {{HTMLElement("select")}}, {{HTMLElement("datalist")}}, {{HTMLElement("option")}}, {{HTMLElement("fieldset")}}, {{HTMLElement("textarea")}}, {{HTMLElement("input")}}, {{HTMLElement("output")}}, {{HTMLElement("progress")}} и {{HTMLElement("meter")}}.
{{HTMLSidebar}}