Книга: HTML: Популярный самоучитель

9.3. Группировка элементов управления

9.3. Группировка элементов управления

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

Рамка создается при помощи HTML?элемента FIELDSET. Между парными тегами <FIELDSET> и </FIELDSET> помещаются определения элементов управления, принадлежащих группе. Вокруг этих элементов управления и будет нарисована рамка.

Для создания подписи к рамке нужно внутри элемента FIELDSET определить элемент LEGEND. Этот HTML?элемент задается при помощи парных тегов <LEGEND> и </LEGEND>, между которыми помещается текст подписи. Можно «поиграть» также с выравниванием подписи при помощи атрибута align, однако следует знать, что разные браузеры по?разному реализуют значения этого атрибута, а некоторые значения и совсем не поддерживают.

В заключение рассмотрим, как реализована группировка элементов управления формы, показанной на рис. 9.1 (пример 9.6).

Пример 9.6. Группировка элементов управления

<HTML>

<HEAD>

<TITLE>Пример страницы с формой</TITLE>

</HEAD>

<BODY>

<FORM action="somesite.com/cgi-bin/proc.exe">

<H1>Регистрация почтового ящика</H1>

<P>

<FIELDSET>

<LEGEND>Персональная информация</LEGEND>

Фамилия: <INPUT name="personal_lastname" type="text" tabindex="1"><BR>

Имя: <INPUT name="personal_firstname" type="text" tabindex="2"><BR>

</FIELDSET>

<FIELDSET>

<LEGEND>Информация о почтовом ящике</LEGEND>

Адрес: <INPUT name="mail_address" tabindex="3"> <BR>

Пароль: <INPUT name="mail_password" type = "password" tabindex="4">

<BR>

Подтверждение пароля: <INPUT name="mail_password" type = "password"

tabindex="5">

</FIELDSET>

<FIELDSET>

<LEGEND>Дополнительные сведения</LEGEND>

Желаете получать рекламные рассылки?

<INPUT name="add_goods" type="radio" value="Yes" tabindex="6">Да

<INPUT name="add_goods" type="radio" checked value="No"

tabindex="7">Нет

<BR>

Желаете получать прогноз погоды на каждый день?

<INPUT name="add_weather" type="radio" value="Yes" tabindex="8">Да

<INPUT name="add_weather" type="radio" checked value="No"

tabindex="9">Нет

</FIELDSET>

<P>

<INPUT type = "submit" value = "Регистрация" tabindex = "10">

<INPUT type = "reset" value = "Сброс" tabindex = "11">

</FORM>

</BODY>

</HTML>

Этот пример является практически законченной страницей с формой: жаль, что по адресу somesite.com/cgi-bin/proc.exe нет реального CGI?приложения, способного обрабатывать форму.

Оглавление книги

Оглавление статьи/книги
Похожие страницы

Генерация: 1.130. Запросов К БД/Cache: 3 / 0
поделиться
Вверх Вниз