4. optgroup - позволяет группировать пункты в элементе SELECT.

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

Название группы задается в атрибуте label элемента optgroup.

Пример 4.

<form>

<p>Справочники:</p> <select name="ask" multiple> <optgroup label="HTML">

<option label="3.2">HTML 3.2 <option label="4.0">HTML 4.0

</optgroup>

<optgroup label="CSS"> <option label="1">CSS-1 <option label="1">CSS-2 <option label="3">CSS-3

</optgroup>

<option value="js">JavaScript <option value="dhtml">DHTML

</select></p>

</form>

Более того, каждую группу можно раскрасить в свой цвет с помощью CSS. Для этого используется свойство background.

Например, первую группу сделаем зеленой, а вторую - желтой.

Пример 5.

<form>

<p>Справочники:</p> <select name="ask"> <optgroup label="HTML" STYLE="background: #090">

<option label="3.2" STYLE="background: #090">HTML 3.2

<option label="4.0" STYLE="background: #090">HTML 4.0

</optgroup>

<optgroup label="CSS" STYLE="background: #ff0">

<option label="1" STYLE="background: #ff0">CSS-1

<option label="1" STYLE="background: #ff0">CSS-2

<option label="3" STYLE="background: #ff0">CSS-3

</optgroup>

<option value="js">JavaScript <option value="dhtml">DHTML </select></p>

</form>