OPTGROUP

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

<form> <br>

<p>Справочники:</p> <br>

<select name="ask">

<optgroup label="HTML"> </optgroup>

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

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

<optgroup label="CSS"> </optgroup>

<option label="1">CSS-1</option>

<option label="1">CSS-2</option>

<option label="3">CSS-3</option>

<option value="js">JavaScript</option>

<option value="dhtml">DHTML</option>

</select>

</form>

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

<form> <br> <p>Справочники:</p> <br>

<select name="ask">

<optgroup label="HTML"

style="background: rgb(0, 153, 0) none repeat scroll 0% 50%;

-moz-background-clip: -moz-initial;

-moz-background-origin: -moz-initial;

-moz-background-inline-policy: -moz-initial;">

</optgroup>

<option label="3.2"

style="background: rgb(0, 153, 0) none repeat scroll 0% 50%;

-moz-background-clip: -moz-initial;

-moz-background-origin: -moz-initial;

-moz-background-inline-policy: -moz-initial;">HTML 3.2

</option>

<option label="4.0"

style="background: rgb(0, 153, 0) none repeat scroll 0% 50%;

-moz-background-clip: -moz-initial;

-moz-background-origin: -moz-initial;

-moz-background-inline-policy: -moz-initial;">HTML 4.0

</option>

<optgroup label="CSS"

style="background: rgb(255, 255, 0) none repeat scroll 0% 50%;

-moz-background-clip: -moz-initial;

-moz-background-origin: -moz-initial;

-moz-background-inline-policy: -moz-initial;">

</optgroup>

<option label="1"

style="background: rgb(255, 255, 0) none repeat scroll 0% 50%;

-moz-background-clip: -moz-initial;

-moz-background-origin: -moz-initial;

-moz-background-inline-policy: -moz-initial;">CSS-1

</option>

<option label="1"

style="background: rgb(255, 255, 0) none repeat scroll 0% 50%;

-moz-background-clip: -moz-initial;

-moz-background-origin: -moz-initial;

-moz-background-inline-policy: -moz-initial;">CSS-2

</option>

<option label="3"

style="background: rgb(255, 255, 0) none repeat scroll 0% 50%;

-moz-background-clip: -moz-initial;

-moz-background-origin: -moz-initial;

-moz-background-inline-policy: -moz-initial;">CSS-3

</option>

<option value="js">JavaScript </option>

<option value="dhtml">DHTML </option>

</select>

</form>

Поддерживается браузерами: MSIE 6, Netscape 6.

<INPUT>

Чаще всего в формах используется тэг <INPUT>. Он не имеет закрывающего тэга. Вся информация, необходимая броузеру для обработки, содержится непосредственно в тэге <INPUT> и задается с помощью различных атрибутов.