<<

стр. 7
(всего 11)

СОДЕРЖАНИЕ

>>

занном. Но даже там редко обходится без ссылки на автора: "Все, что вы думаете
по этому поводу, пишите сюда".
Но чаще "сайтовладелец" желает получать о своих посетителях гораздо больше
информации. Мы не будем говорить здесь о полулегальных способах отслеживать
поведение посетителей без их ведома и согласия. Речь пойдет о способах получе-
ния информации от самих пользователей, — например, анкетных данных для
вступления в виртуальный клуб или мнений по интересующему вас вопросу.
Как получить данные и передать их для обработки?
Для этой цели используются формы — элементы Web-страницы, содержащие
такие знакомые нам поля ввода, списки, кнопки и прочие верные признаки гра-
фического интерфейса.
Подобно фреймам, таблицам и другим "крупногабаритным" элементам Web-
страницы, форма — это блок HTML-кода, образованный специальными элементами
HTML. Границами такого блока служат, как легко догадаться, дескрипторы <FORM>:
<FORM параметры>

</FORM>
Какие параметры имеет этот дескриптор?
Давайте задумаемся: какие вообще могут быть параметры у всех этих тексто-
вых полей, списков, "точек", "галочек" и кнопочек, с которыми по нашей мило-
сти возится пользователь? Раз эти параметры выносятся "за скобки", в заглавный
дескриптор блока, то они должны быть общими для всех описанных элементов
интерфейса. Но ведь элементы эти такие разные, такие непохожие друг на друга!
Единственное, пожалуй, что их объединяет, — это то, что все они предназначены
для получения от пользователя какой-то информации.
Первое, что приходит в голову: эту информацию нужно как-то обрабатывать.
Поэтому параметры дескриптора <FORM> должны описывать то, что нужно делать
дальше с полученными данными. И это действительно так!
В самом деле: ввел, предположим, посетитель электронного магазина в одной
строке адрес, куда доставить покупку, в другой — номер кредитной карточки, с кото-
рой перечислить деньги, выбрал из списка товар, щелкнул на кнопке "купить" и...
что дальше? А дальше все это нужно передать на сервер и там как-то обработать.
Действие, которое следует выполнить с введенными в форму данными, определя-
ется параметром action. Точнее, этот- параметр определяет не столько само действие,
сколько URL, по которому расположен обработчик данных. Чаще всего в качестве
такого обработчика выступает специальная программа. Эта программа может быть
расположена как на удаленном сервере, так и на компьютере посетителя страницы.
Написана она может быть, в принципе, на любом языке. В частности, для простой
обработки данных широко применяется язык сценариев JavaScript (см. главу 16).
Впрочем, вместо адреса программы-обработчика значением параметра action может
быть обычный адрес электронной почты. Тогда данные формы будут просто отправ-
лены по этому адресу, а что с ними делать дальше — решит получатель.
Каким способом передаются данные? Уточним сразу: HTML не вмешивается в
способы кодирования и передачи информации по сетям Internet. Однако сущест-
вует два принципиально разных метода: первый заключается в передаче самих
данных ("покупатель: Александр Петров; номер карточки: 123456789; покупка:
костюм мужской и т.д."), второй — в передаче указателя на то место, где они на-
ходятся (например, URL). То, какой именно из них используется для данной
формы, определяется параметром method. Передача данных соответствует значе-
нию post (в переводе с английского "переслать"), а передача ссылки — значению
get ("получить"). По умолчанию используется последний вариант. Действитель-
но, зачем лишний раз нагружать сеть? Лучше передать ссылку и этим ограни-
читься. Но передавать данные формы по электронной почте приходится полно-
стью, а для этого используется значение post.
Вы, должно быть, слышали о существовании различных типов кодирования инфор-
мации, передаваемой через Internet. Тип кодирования данных, введенных через форму,
определяется параметром enctype (от английского encryption type — тип кодирования). В
данном случае имеются в виду типы кодирования MIME. По умолчанию параметр enc-
type принимает значение application/x-www-form-urlencoded, но при отправке данных
электронной почтой используется тип text/plain. Таким образом, для того чтобы дан-
ные формы передавались по электронной почте, код формы должен выглядеть так:



186 Глава 12
<FORM dLction=mai.lto:no4TOBUH@aflpec method=post enctype=text/plain>

</FORM>
Наконец, обратим внимание еще на одну деталь. Как правило, после заполнения
формы содержащее ее окно закрывается, и на его месте появляется другое, — напри-
мер, с сообщением о том, что данные успешно введены и получены. Как описать, в
каком окне или фрейме будет открыта следующая страница? Правильно, с помощью
уже знакомого нам параметра target (см. главу 11).


Из чего состоит форма
Уф... Кажется, с самой формой мы разобрались. Но, как учат философы, форма
без содержания — ничто. Правда, другие философы с ними спорят и доказывают
обратное... Но, если говорить не об абстрактной форме, а о формах HTML, то факт
налицо: HTML-формы без содержания действительно не имеют смысла.
Что является содержанием HTML-формы? Пожалуй, ответить на этот вопрос вы
могли бы и сами. Для этого достаточно вспомнить любую анкету или бланк, которую
вам когда-либо приходилось заполнять. Давайте вспоминать вместе: что там было?
Масса пустых строчек, куда нужно вписать фамилию, адрес, дату... Нужное подчерк-
нуть... Отметить "птичками" один ипи несколько из предлагаемых вариантов (а если
анкета электронная, не забыть убрать выделенные варианты, предлагающие присы-
лать вам по электронной почте всякую чепуху)... Да, и еще, конечно же, обычный
текст — пояснения, что и куда нужно вписывать. Как правило, маловразумительные...
Ну и всякие картинки, оживляющие пейзаж: логотипы, печати, рамки. Наконец, в
электронных анкетах вместо барышни, которой нужно сдать бумажку, имеются кноп-
ки: "Принять", "Отменить" и т.п.
Да, набралось порядочно. Давайте все это как-то классифицируем, чтобы не
запутаться.
Первое, что бросается в глаза: все содержимое формы делится на две катего-
рии. В первую попадает все, что требует вмешательства пользователя: заполнить,
подчеркнуть, отметить, нажать и т.п., во вторую — все остальное, что достаточно
прочитать, просмотреть или можно вообще оставить без внимания. Назовем эле-
менты первой категории — поля ввода, "птички", кнопки, списки — активными,
а элементы второй категории — текст, картинки — пассивными.
Пассивные элементы формы нам хорошо знакомы. Они ничем не отличаются
от любых других элементов Web-страницы. А вот к активным элементам стоит
присмотреться внимательнее.
Например, какие общие свойства присущи таким элементам и, соответст-
венно, какие общие параметры есть у описывающих их дескрипторов? Таких
свойств два. Во-первых, это информация, которую вводит пользователь через
данный элемент формы. Эта информация присваивается параметру value. Во-
вторых, это уникальное в пределах формы имя, по которому данный элемент от-
личается от других. Это имя присваивается параметру name — аналогичный пара-
метр нам уже встречался в фреймах (см. главу 11).


Формы 187
Текстовые строки
Строки для ввода текста на HTML-страницах встречаются сплошь и рядом.
Тому, кто хоть раз пользовался поисковым Internet-сервером, не надо объяснять,
что это такое: узкий вытянутый прямоугольник, внутри которого можно ввести с
клавиатуры одну строку текста (рис. 12.1).




Картинки Группы Каталог

' Расширенный поиск
(издательский дом Вильяме 1
Настройки
• Языковые инструменты
<= Искать в интернете г Искать в русском



,
Помощь- Всё о Google- Google In English
w
Рис. 12.1. Интерфейс поисковой системы — это тоже форма. Обычно
она состоит из текстовой строки и кнопки ввода

Для ввода однострочных полей используется дескриптор <INPUT>. Это непарный
дескриптор, обладающий целым "выводком" параметров, описывающих самые раз-
нообразные свойства. В зависимости от значения параметра type этот дескриптор мо-
жет "принимать вид" самых разных элементов формы. В частности, когда этот пара-
метр имеет значение text, дескриптор <INPUT> "превращается" в текстовую строку.
Похоже, пора перейти от теории к практике. Создадим форму для ввода некото-
рой текстовой строки, воспользовавшись для этого уже известными нам сведения-
ми о дескрипторах <FORM> и <INPUT>. Для простоты пока что будем предполагать, что
вся вводимая информация затем пересылается по электронной почте (рис. 12.2).




188 Глава 12
ffj TESTHTML - bnuKHUT


<FORH act ion:"mail to:nynailQnail.ru"
enctype=text/plain method=post>
<и>Вввдитв строку:</U>
<INPUT type:text nane:search
ualu*="123Ч56783123Ч56789123456789">
</FORM>




СТРОКУ: |1234Б67891234Б678




Рис. 12.2. Простейшая форма, содержащая текстовую строку

Обратим внимание на несколько интересных моментов.
Прежде всего: что находится внутри формы? Кроме текстовой строки для вво-
да данных, — обычный форматированный текст, такой же, как везде. Текстовая
строка имеет имя search и начальное значение 123456789123456789123456789, при-
своенное параметру value. Как видим, этот параметр используется не только для
передачи введенных данных, но и для вывода исходных значений.
Зачем мы выбрали такую последовательность цифр? Чтобы измерить длину стро-
ки. Как видим, в ней помещается 18 знаков. Как растянуть ее или, наоборот, сузить?
За это "отвечает" параметр size. Его значением является число символов, по-
мещающихся в строке. Например, если нужно ввести что-то очень короткое —
скажем, сегодняшнее число — то строку можно сократить до двух символов, при-
своив параметру size значение 2. Но помешает ли это посетителю ввести более
длинное число? Нет. Просто символы, введенные первыми, "уедут" из видимой
части строки влево (рис. 12.3).
Для того чтобы ограничить также вводимую строку, используется параметр
maxlength. Его значением служит количество символов, принимаемых формой и
передаваемых для обработки. Если присвоить этому параметру значение 2, то
пользователь просто не сможет ввести третий символ (рис. 12.4).
А теперь рассмотрим несколько специфических вариантов текстовых строк.
Довольно часто встречаются ситуации, когда вводимая строка не должна быть
видна на экране. Типичный случай — пароль. Для того чтобы обеспечить конфи-
денциальность такого рода, используются текстовые строки специального вида -
параметру type присваивается значение password (рис. 12.5).




189
Формы
:FORM action=".ailto:«y.aiie«ail.ru"
•nctype:text/plain «ethod=post>
!ввдите сегодняшнее число:
:INPUT tupe=text nane=data




Введите сегодняшнее число



.......
ilons@ukr.net (moil)




Рис. 12.3. Ограничение длины видимой текстовой строки с помощью пара-
метра size не мешает пользователю ввести значение, превышающее ее длину


<FORH action="mailto:Mymail@nail.ru"
enctype:text/plain nethod=post>
Введите сегодняшнее число:
<INPUT type=text name: dot a siz»=2 ДЧГНЯТДЕЬ •
</FORH>




) D:\Mydocs\DIALEC



Введите сегодняшнее число




--^—-.з Mif. rnsoft Internet Explorer.

data=12


Рис. 12.4. Параметр maxlength ограничивает длину вводимой текстовой строки

Глава 12
190
<FORM action="»ai 1 to:nynai18nai 1.ru"
enctype=text/plain i«ethod=post>
Введите пароль:
<INPUT nane^psu size=8>




D:\Mydocs\DlALECT\
=-———... —-•- •-

Введите пароль



_polons©comizdat.com (Диалектика)




Форма отправлена из Microsoft Internet Explorer


psw=naponb


Рис. 12.5. Ввод пароля: в окне броузера отображаются звездочки,
но для обработки передается значение, введенное в действительности

Пожалуй, не менее часто возникает необходимость в передаче файла, имя ко-
торого вводится в HTML-форме. До сих пор в некоторых приложениях встреча-
ются моменты, когда от пользователя требуется вводить имя вручную — полно-
стью, вместе с длинным путем. И неоткуда скопировать... Если вы с такой про-
блемой сталкивались, то поймете меня, а если нет — поверьте на слово: это
сущее наказание. Неудивительно, что пользователь всеми силами избегает по-
пасть в такую ситуацию второй раз. Грамотные разработчики помещают рядом со
строкой, куда нужно ввести имя файла, стандартную кнопку Обзор. Щелкнув на
ней, пользователь открывает стандартное окно Windows, в котором и выбирает
нужный файл. Для того чтобы такая кнопка появлялась рядом с текстовой стро-
кой HTML-формы, параметру type присваивается значение file (рис. 12.6).

Иногда возникает необходимость передать из формы программе-
обработчику некую скрытую информацию — такую, которую пользова-
тель не то что не вводит, но даже и не видит. Для этого используется
дескриптор <INPUT> с параметром type=hidden:
<INPUT type=hidden name=secret value="B этом письме содержится анкета">




Формы 191
<FORH act 1оп="шв11 to: nyiiiail8iiail.ru"
enctupe= text/plain method=poet>
Выберите »айп:<Ьг>
<INPUT IJII.fmitJ name=fl size=5S>




i .'-^. . Ш 1 m
* ....':.:::.
D:\MydocsVDiALECTYItmlTutor\TESTHTMLhtml


Выберите файл:
p :VMy docsVD I ALECTVHtmlTutortFAQ .doc




ч'ирма отправлена из Microsoft Internet Explore


fl=D:\My docs\DIALECT\HtmlTutor\FAQ.doc


Рис. 12.6. Для ввода имени файла используется тек-
стовая строка с параметром file


Кнопки
Кнопки — главный элемент любой электронной формы. Не согласны? Что ж,
возможно, вы правы. Но как сообщить о том, что ввод данных завершен, если
форма лишена кнопки "Отправить"?
До сих пор мы действительно обходились без кнопок: пока дело касалось
лишь текстовых строк, для ввода данных достаточно нажать клавишу <Enter>.
Однако с другими элементами форм такой "фокус" не удастся. Поэтому, прежде
чем обогатить нашу форму этими элементами, мы снабдим ее средствами управ-
ления в виде кнопок.
Как это ни странно, кнопки создаются с помощью того же дескриптора
<INPUT>, что и текстовые строки. Однако значение параметра type в этом случае
другое — в зависимости от назначения кнопки.
Чаще всего — практически всегда — в формах встречается кнопка для передачи
данных программе-обработчику. Надписи на ней бывают разные — "Принять",
"Отправить", "ОК", "Поехали!". В сущности, это не важно. То, что происходит
при щелчке определяется не надписью.




192 Глава 12
<FORM action="mailto:mymailQmail .ru"
enctype=text/plain method=post>

аше иня:<Ьг>
<INPUT type=text name=fio galue=<W10 size=50>

<P align=centerXINPUT Q Q name=ok>

</FORM>




D:\My docs\DIALEC1\HtmlTuloATE




| Иванов Иван Иваныч




йид В< Tf , I f• ,
iCkstS;, ^ i в if; 4



(Форма отправлено из Microsoft Internet Explorer



По=Иванов Иван Иваныч
сЖ=Подача запроса




Рис. 12.7. Для того чтобы создать кнопку отправки дан-
ных, параметру type присваивается значение submit

Для того чтобы создать такую кнопку, параметру type присваивается значение
submit. Какую роль здесь играют другие параметры, например name и value? По-
смотрим. Создадим форму, показанную на рис. 12.7, и щелкнем на кнопке. Как
видим, если опустить параметр value, то по умолчанию на кнопке появляется
надпись "Подача запроса". И она же присваивается имени ok при передаче ре-
зультатов. Если вдуматься, все должно быть немного иначе. Во-первых, надпись
на кнопке могла бы быть более информативной и дружелюбной. Мне, например,
нравится "Отправить". Давайте сразу присвоим это значение параметру value. Во-
вторых, зачем передавать программе-обработчику надпись на кнопке? Нонсенс.
Убираем параметр name и получаем как раз то, что нужно (рис. 12.8).




193
Формы
<FORM action="mailto: «ymailStnall .ru
enctype=text/plain method=post>

Ваше иня:<Ьг>
<INPUT type=text nane-fio иа!и*=ФИО size=50>

<P align=center><INPUT type=submit LIMIII--U»tJil.fclil!bJa>

</FORM>




D:\Wy docs\DIALECT\HtmlTutoATE




Петров Сергей Сергеич




форма отправлено из Microsoft Internet Explorer



тю=Петров Сергей Сергеич




Рис. 12.8. Параметр value определяет надпись на
кнопке, а параметр name вообще не обязателен

Если стандартный серый квадрат с надписью не "вписывается" в дизайн страни-
цы, его можно заменить на любой рисунок. Для этого параметру type вместо submit
присваивается значение image. После этого кнопка превратится в рисунок, а дескрип-
тору <INPUT> можно присваивать все те параметры, что и обычным изображениям (см.
главу 8). Кроме того, при этом программе-обработчику передаются дополнительные
данные — координаты точки, в которой посетитель щелкнул на кнопке-картинке
(рис. 12.9). Отсчет ведется в пикселях, от верхнего левого угла изображения.




194 Глава 12
FORM act ion= "«tail to: nynailQiail.ru"
enctype= text/plain method=post>

аше имя:<Ьг>
INPUT type=text name=fio иа!ие=ФИО size=50>

P align=centftr><INPUT Н1ВНЯмН!Н name=send
src=send.gif аН = Отправить>




DWydocs\DIALECT\HlmmitorVm;gJ:;|t»




Сидоров Петр Петрович




[
III e_polons©ukr.ne1 (moil]
'lU-.-.MV



Форме отпровпена из Microsoft Internet Explorer


п'о=Сидоров Петр Петрович
send.x=21
send.y=35


Рис. 12.9. Кнопка, превращенная в картинку,
сохраняет все параметры изображения
Следующая по распространенности функция кнопки в электронной форме —
вернуть все, как было. Конечно, если форма состоит из единственной строчки,
посетитель вполне справится и сам. Но представьте себе длиннющую анкету, ко-
торую нужно целиком "обнулить". Обрадовала бы вас перспектива почистить все
поля с помощью мыши и клавиатуры? По-моему, вопрос излишен.
Для создания кнопки возврата параметру type присваивается значение reset. В
результате получаем точно такую же кнопку, что и в случае submit, только резуль-
тат ее действия другой, вместо того чтобы отправить данные на обработку, дан-
ные просто удаляются, и форма приводится к исходному состоянию (рис. 12.10).
Обратите внимание: можно заменить рисунком кнопку отправки дан-
ных, но не кнопку отмены. Увы...



195
Формы
<FORH action="«ilto: •ynaiiaiail.ru"
enctype=text/plain nethod=post>
Ваше имя : <8R>
<INPUT type=text neB»=
<P align'c
<INPUT HR-ШЗШЭЯ Уа1ие=0тнвнить>
<INPUT type=submit иа!ие=0тправить>
</FORM>




Ш т • mm
Ui • Ыi -
!




Щформа отправлена из Microsoft Internet Explorer




Рис. 12.10. С помощью значения reset создается кнопка, возвращающая форму в исход-
ное состояние

На рис. 12.10 показан типичный недочет: надписи на кнопках, выпол-
няющих противоположное действие, похожи. Что стоит посетителю, ко-
торый торопится (а они вечно торопятся, ведь у провайдера счетчик ми-
нут тикает!) и поэтому читает "по диагонали", ошибиться и щелкнуть не
на той кнопке? И что он затем скажет в ваш адрес?.. В этом смысле
привычные, хоть и не всем понятные ОК и Cancel куда лучше незнако-
мых надписей, заставляющих медлить и разбираться, что к чему.
Если необходимо создать кнопку, назначение которой отличается от приема
данных и сброса, используется значение type=button. Действие, выполняе-
мое при щелчке на кнопке, определяется параметром onclick (см. главу 16).




196 Глава 12
Текстовые поля
Не всегда текст, который нужно ввести, помещается в одной строке. Бывает,
что он растягивается на несколько строк или даже абзацев. Конечно, можно
обойтись текстовой строкой "бесконечной" длины (без указания значения пара-
метра maxlength). Однако выглядит такая строка — без начала, без конца — не-
изящно, а пользоваться ею очень неудобно.
Поэтому для ввода крупных блоков текста предусмотрен другой элемент фор--
мы — поле ввода. Типичный пример такого поля — а заодно и нескольких видов
текстовых строк — можно встретить на любом сайте, предоставляющем бесплат-
ные услуги электронной почты (рис. 12.11).




"Елена Полонская" <e_polanseiukr.net>
Выбрать получателей из адресной книги •




Получите бесплатный почтовый ящик tjjiukr.net на http://freemail.ukr.net




Т Сохранить в 'Отправленные"
Вяожитьфвйл: . •
:ДШ'
Размер файла не может превышать SdQKb. одно сообщение может содержать




Рис. 12.11. Типичный пример поля ввода — форма электронного письма

Для создания текстового поля используется дескриптор <TEXTAREA>. Что полу-
чится, если просто использовать его интуитивно, применяя параметры name и
value по аналогии с текстовыми строками? Явная ошибка (рис. 12.12).
Прежде всего: почему в поле ввода оказался весь остальной код? Потому что
дескриптор <TEXTAREA> — парный, а мы его не закрыли. Внутри него помещается
текст, который должен оказаться в поле ввода по умолчанию. Это логичнее, чем
делать его значением параметра value: ведь текст может быть довольно длинным.



197
Формы
<FORM action*"«ailto:nynaiienail.ru"
enctype= text/plain n»thod=post>

Здесь можно ввести длинный текст:<Р>
<TEXTflREft nameHext ualue= "Начинайте пряно отоеда"|> :
<Р align=cent»r>
<INPUT type=reset иа1ие=Сначала>
<INPUT type=submit иа!ие=Готооо>

</FORH>




Здесь можно ввести длинный текст:

уа!ие=Сначала>




Рис. 12.12. Поле ввода очень похоже на строку ввода, но использо-
вать дескриптор <TEXTAREA> по аналогии с <INPUT type=text> — ошибка

Несмотря на то, что содержимое поля ввода не является значением па-
раметра value и, теоретически, может содержать дескрипторы формати-
рования, на практике оно форматированию не подлежит. Весь текст вы-
водится, как правило, моноширинным шрифтом ("пишущая машинка").
Следующий вопрос: почему поле ввода такое маленькое? Очевидно, оно такое
по умолчанию. Для того чтобы его "раздвинуть", нужно описать его размеры явно.
Высота поля ввода определяется параметром rows и измеряется в строках, шири-
на — параметром cols и измеряется в символах. Поскольку текст выводится моно-
ширинным шрифтом, такой подход оказывается точным и не приводит к появле-
нию строк разной ширины.
Теперь мы знаем достаточно, чтобы создать такое поле ввода, как нам хочется
(рис. 12.13). Почти. Осталось выяснить еще один нюанс. Что происходит, если со-
держимое не помещается в окне? Если строк слишком много, полоса прокрутки
справа от них "оживает" и начинает оправдывать свое существование. А если стро-
ка слишком длинная? Разумеется, когда она приближается к правой границе окна,
очередное слово появляется "этажом ниже". Но в каком виде такая "разорванная"
строка передается на обработку? Отдельными кусками или целиком?
Оказывается, можно и так, и эдак. Способ представления текста, вводимого в
окно, определяется параметром wrap. По умолчанию все происходит именно так,
как ожидается: в окне текст автоматически разбивается на строки, но при пере-
даче эта автоматическая разбивка не сохраняется: если вы ввели все одной стро-
кой, то оно так и будет передано. Этот режим соответствует значению virtual.
Если мы хотим, чтобы переход на новую строку в окне происходил только когда


198 Глава 12
пользователь нажимает <Enter>, мы должны присвоить параметру wrap значение
off. Наконец, если мы хотим, чтобы переход на новую строку происходил авто-
матически и эта разбивка сохранялась при передаче текста на обработку, нужно
использовать значение hard (рис. 12.14).


(FORM action="«ailto:»ynaiia«ail .ru
enctype=text/plain method=post>

здесь можно ввести длинный текст:
СР aliqn=center>

•(очинаите пряно отсюда
:/ТЕХТЯкЕЙ>




Ос-генпе.. Шмоаи»



Здесь можно ввести длинный текст
Начинайте прямо отсюда




'рма отправлена из Microsoft Internet Explore


1ехт=Начинаите прямо отсюда




Рис. 12.13. Так работает "правильное" поле ввода




199
<FORM act ion:"»ai1tо:«yuaila»ai1.ru"
enctype=text/plain method=post>
Здесь можно ввести длинный текст:
<Р ali9n=center> ^^^^
^^^^
<ТЕХТЙкЕЙ паяе-text cols=25 rous=5 ВЯЯКНЯНЬ
Очень, очень дпиная-предпинная, просто бесконечная
</ТЕХТнкЕЙ>

штштяяш
Еиа № ): № О
!(.НВ CEFC..W.




Здесь можно ввести длинный текст:
Очень, очень длиная-
предлинная, просто
бесконечная строка




а и т мрави^нп из Microsoft Internet Explorer



1ех1=Очень, очень длиная-предлинная, просто
бесконечная строка




200 Глава 12
<FORM action: "«ailto: nyiiiaiieiiiail.ru"
enctype=text/plain method=post>

Здесь можно ввести длинный текст:
<Р align=center>
<TEXTftREft na«e=text cols=Z5 rons=5
Очень, очень дпиная-предлинная. просто бесконечная:;




• •& . т
• D:\Wy docs\DIALECT\HtrnlTutor\TESTHTJ»
3


Здесь можно ввести длинный текст
Очень, очень длиная-пр*




••9: I

S



1ехг=Очень, очень длиная-предлинная, просто
бесконечная строка




201
<FORH action^"nailto:mymaiianai1.ru"
enctype=text/plain method=post>
Здесь можно ввести длинный текст:
<Р align:center>
<ТЕХТЯРЕЙ nan»:text cols=25 rows=5 НИЛШ1ШЛ>
Очень, очень дпиная-предлинная, просто бесконечная;
</TEXTflREfl>
<Р В1
<INPU
<INPU




Здесь можно ввести длинный текст:
Очень, очень длиная-
предлинная, просто
I
бесконечная строка




ттт
4? -


Ш ' ' " ' |Формв (л мревлена из Microsoft internet Explorer.


1ех1=Очень, очень длиная-
предлинная, просто
бесконечная строка

в)
Рис. 12.14. Три режима отображения и передачи длинных строк, определяемые парамет-
ром wrap: перенос при вводе (а), отсутствие переноса (б), и перенос при вводе и передаче (в)


Списки вариантов
В электронных формах существует два типа списков, из которых посетителю
страницы предлагается что-то выбрать. В первом случае допускается выбор не-
скольких вариантов, во втором — только одного. Мы будем называть список пер-
вого типа списком вариантов, а список второго типа — списком-переключателем.
Обычно пункты списков вариантов снабжены квадратными "окошками", в ко-
торых при выборе появляются "птички" (checkbox). Для создания такого списка
используется уже знакомый нам дескриптор <INPUT> с параметром type=checkbox.
Как это выглядит? Очевидно, таких дескрипторов должно быть столько же,
сколько вариантов в списке. В остальном — кажется, мы уже знаем, как пользо-
ваться параметрами name и value... Однако, видимо, в данном случае ими нужно
пользоваться как-то иначе (рис. 12.15).

202 Глава 12
1
FORM action= "mailto:nynail8Bail.ru'
enctype:text/plain «ethod=post>
Ваше любимое блюдо:<Ьг>
<1NPUT type=checkbox name=choice value:"Заварные пирожныв">
<INPUT type=checkbox name=choice value:"Фруктовый коктейль")
<INPUT type=checkbox name=choice value:"Шоколадный торт">
</FORM>




Ваше любимое блюдо:



Рис. 12.15. Попытка создать список вариантов: использование
знакомых параметров не приводит к желаемому результату


FORM action="«ailto: niymailQmail . ru"
enctype: text/plain «iethod=post>
Заше любимое 6пюдо:<Р>
INPUT type=cheekbox naie:ekler> заварные пирожные<ВВ>
INPUT type=checkbox name=fruit> фруктовый коктейпь<ВР>
INPUT type=chackbox na»e=choco> шоколадный TopT<BRX/I>
P alig
INPUT
INPUT




Ваше любимое блюдо
г заварные пирожные
фруктовый коктейль
шоколадный торт


тир»- ; чг t ri'miiiiiiiiii-
а
I



˜˜;?%$УЩФорма отправпема из Microsoft Interne! Explorer



fruit=on
choco=on



Рис. 12.16. Код списка вариантов состоит из самостоятельных деск-
рипторов <INPUT>; в качестве пояснений используется обычный текст

Формы 203
Для создания списка вариантов в самом деле нужно столько дескрипторов <INPUT>,
сколько в нем есть вариантов. Однако имена у них должны быть разные — у каждого
варианта свое. Зачем это нужно? Дело в том, что, хотя логически список является
цельным элементом формы, с точки зрения кода это всего лишь набор разрозненных,
несвязанных дескрипторов. У каждого — свое имя и значение. А для того чтобы стало
ясно, что именно нам предлагают выбрать, нужно снабдить эти квадратики поясне-
ниями. Обычными текстовыми — параметр value здесь явно не годится (рис. 12.16).
Обратите внимание: имена всех элементов списка — разные. Что будет,
если сделать одинаковыми все или некоторые из них? Если вы думаете,
что завизжит сирена и броузер выдаст сообщение об ошибке, то оши-
баетесь. Броузер молча "проглотит" вашу оплошность и впоследствии
будет вести себя так, как будто ничего не случилось. Но случилось ли
что-то на самом деле? Решать вам (рис* 12.17).


FORM action^"mailto:inynaiieiiail.ru"
enctype=text/plain nethod=post>

Ваше любимое блюдо:<Р>
<1>
<INPUT type=checkbox nane=choco> заварные пирожные<ВР>
<INPUT type=checkbox name=choco> *руктовый коктейпь<ВН>
<INPUT typs=checkbox naine = choco)> покопанный торт<ВР></1>

<P aligtvcenter
<INPUT type=rese
<INPUT type=subm

</FORM>


Ваше любимое блюдо:
f заварные пирожные
г фруктовый коктейль
р шоколадный торт




т
ФормвотправленаиэМ1сго80«1п1вгпв!Ехр1огег




Рис. 12.17. Вот что получается, если разные варианты
списка имеют одинаковые значения параметра name


Глава 12
204
Отметим еще одну важную особенность. Как передаются данные о выбранных
вариантах? Очень просто. Если соответствующий пункт списка выбран, его имя
включается в состав передаваемых данных со значением on (см. рис. 12.16). А как
поступить, чтобы один из пунктов был выбран по умолчанию? Естественно пред-
положить, что для этого нужно включить в соответствующий дескриптор <INPUT>
параметр value со значением on. Однако, если вы проверите эту версию на прак-
тике, то убедитесь, что она не работает: каким бы ни было значение параметра
value, в случае списка вариантов оно игнорируется. Если мы хотим, чтобы какой-
то из пунктов был выбран по умолчанию, то нам понадобится дополнительный
параметр — checked. Значений он не имеет — просто включите его в состав соот-
ветствующего дескриптора (рис. 12.18).


FORM action="»ailto:»ynaiie«ail.ru"
enctyp»=text/plain n»thod=po8t>
am» любимо» блюдо:<Р>
I>
INPUT type=checkbox nanie=ekler> заварные пирожм>ю<Вк>
INPUT typ»=checkbox no»e=fruit> «с сговый кокт«йпь<ВР>
INPUT type=checkbox nane=choco НЯяШЬ «окопадный торт<ВЙ></1>

P align=center>
INPUT type=resot ualu
INPUT type=subiit ual

/FORM>
J •''--' '
ЩЙ ^ :
' Йй

Ваше любимое блюдо
г заварные пирожные
г фруктовый коктейль
R шоколадный торт


Lxplore, ИВ
Н




аиз
Microsoft Internet Explorer.



|choco=on


I

Рис. 12.18. Для того чтобы один из пунктов списка вариантов был вы-
бран по умолчанию, используется не имеющий значений параметр checked

Заполняя различные Internet-анкеты, вы могли обратить внимание на то,
что такие списки, "заполненные" по умолчанию, встречаются достаточно
часто — чаще, чем хотелось бы. Обычно в конце длинной-предлинной


205
Формы
формы мелким шрифтом стоит что-то вроде "Я хочу регулярно получать по
почте рекламу продукции", а рядом — незаметная "птичка". И кто обвинит
владельца сайта в распространении спама? Ведь вы сами его "попросили",
не дочитав до конца и поторопившись щелкнуть на кнопке...

Списки-перекл ючатели
В списках-переключателях слева от пунктов имеются кружки, причем в центре
кружка, соответствующего выбранному пункту, появляется жирная точка (radiobut-
ton). Для создания таких списков используется тот же дескриптор <INPUT>, что и для
списка вариантов, но параметру type присваивается значение radio. Как и в списке
вариантов, каждому элементу списка-переключателя соответствует отдельный деск-
риптор <INPUT>. Однако, в отличие от списка вариантов, все элементы списка-перек-
лючателя имеют одно имя. Иначе и не может быть: ведь мы хотим получить только
одно значение из всего перечня. Наконец, здесь, как и в списке вариантов, для выбо-
ра одного из пунктов по умолчанию используется параметр checked (рис. 12.19).


<FORM action="«oilto:iyiaiiaMil.ru"
•netype:text/plain method=poet>

выберите что-нибудь одно:<Р>

<INPUT НЛ^НЕВЭ nane=choic»> заварные пирожньм<ВН>
<INPUT type=radio name=choice> «руктовый кокт»йпь<ВН>
<INPUT type = radio na«ie = choice checked) шокопадный торт<Вк></1> ;

<P align=center>
<INPUT type=reset иа!и«=Сначала>
<INPUT typesoubmit иа!и«=Готово>

</FORH>




Выберите что-нибудь одно:
г заварные пирожные
г фруктовый коктейль
3 шоколадный торт




Твма::. ;,/..; '.-= (Форме отправлена из Microsoft Internet Explorer




Рис. 12.19. Список-переключатель формируется
из дескрипторов <INPUT> с параметром type=radio

206 Глава 12
Раскрывающиеся списки
Списки часто бывают очень длинными и скучными. И занимают много места.
Если форма бумажная — ничего не поделаешь. Тяжко вздыхаем и заправляем в
принтер еще один лист. Но если форма электронная и мы не хотим зря занимать
место, можно воспользоваться раскрывающимся списком. Что это такое, знает
любой, кто имел дело с Windows дольше получаса: строка, в которой что-то на-
писано, а справа — небольшая кнопка со стрелкой. Если щелкнуть на стрелке,
вниз "выпадает" список. Щелкаем на одном из его пунктов — и список сворачи-
вается обратно, а в строке появляется выбранный пункт.
Как сделать подобный список на HTML-странице? Сам список создается с
помощью дескриптора <SELECT>, а отдельные элементы — с помощью дескрипто-
ров <OPTION>. Вся конструкция имеет вид, показанный на рис. 12.20.
IR TESTIITML - Пткни



|j<FORM action= "nailto:itynaiiaiail.ru"
enctype=text/plain method=post>

Цкакой сегодня день:
<P align=center>
SELECT name= day;
<OPTION ualue="He понню">Не помн,
'.OPTION ualue= Понедельник ^Понедепьнт
<OPTION иа!че=Вторник>Вторник
D:\Mydocs\DI И

<OPTION иа!ие=Четверг>Четверг
Какой сегодня день:
<OPTION иа1ие=Пятница>Пятница
<OPTION иа1ие=Суббота>Суббота
< OPT ION иа1ие=Воскрееенье>Воскоесенье
ik/SELECT>

<Р align=center>
<INPUT type=reset иа1ив=Сначвла>
<INPUT type = subi«it иа!ие = Готово>

</FORM>




Рис. 12.20. Раскрывающийся список создан
с помощью дескрипторов <SELECT> и <OPTION>

Вообще-то, дескриптор <OPTION> — парный. Но закрывать его не обяза-
тельно, так же как уже знакомые нам дескрипторы <Р>, <Ы> и др.



207
Формы
Как видим, система "<SELECT> — <OPTION>" работает просто: программе-обра-
ботчику передается имя дескриптора <SELECT> и значение параметра value того из
дескрипторов <OPTION>, который соответствует выбранному пункту списка.
Если мы хотим, чтобы по умолчанию был выбран определенный пункт спи-
ска, мы должны либо расположить его дескриптор <OPTION> первым, либо исполь-
зовать уже знакомый нам параметр checked или selected.
Однако на этом возможности раскрывающегося списка не исчерпываются. По
умолчанию список представляет собой одну строку, которая "раскрывается" при
щелчке на кнопке. Но мы можем модифицировать список так, чтобы он принял вид
окна, содержащего несколько строк и — при необходимости — полосу прокрутки.
Для этого нам потребуется параметр size дескриптора <SELECT>. Этот параметр опре-
деляет количество строк, из которых состоит список в "закрытом" состоянии, и по
умолчанию равен 1. Что получится, если сделать его равным, например 3? Окно с по-
лосой прокрутки, в котором можно выбрать нужный день (рис. 12.21).


<FORH action="«ailtO:iy»aili«ail .ru"
enctype=text/plain nethod=post>
Какой сегодня день:
<P align=c*ntef>
«ELECT na»e=day
<OPTZON name=a ualue-"He помню">Не помню
«JPTION иа1ие=Понедельник>Понедельник
«JPTION иа!ив=Вторник>Вторник
<OPTION иа!ие=Среда>Среда
<OPTION иа1ие=Четрерг>Четверг
<OPTION иа1ие=Пятница>Пятница
<OPTION иа1ие=Суббота>Суббота
<OPTION иа!ие=Воскресенье>Воскресенье •
</SELECT>
<P align=cen
<INPUT type=
<INPUT type:




Рис. 12.21. Параметр size определяет коли-
чество одновременно видимых строк списка

Ну как, нравится? По-моему, скорее необычно, чем красиво или полезно. Но
не будем торопиться с вердиктами. В таком виде, возможно, и впрямь не очень
практично. Но ведь иногда из списка требуется выбрать не одно, а сразу не-
сколько вариантов. И тогда возможность видеть их все сразу может очень приго-
диться. Для того чтобы список позволял выбрать сразу несколько вариантов, ис-


208 Глава 12
пользуется параметр multiple. Как и checked, этот параметр не имеет значений.
Просто проставляем его — и все (рис. 12.22). Обратите внимание: в результате
программе-обработчику передается несколько значений с одинаковым именем.


<FORN act ion= "nail to: пуна! 1вма11.ru"
«nctype=text/plain method=post>
Какие они недели Вы больше всего любите:
<Р align=c«nt»r>
<SELECT nane=day size=8
<OPTION ualu«="He энвю">Н* знаю
<OPTION иа!ие=Понедельник>Понедельник
<OPTION иа!ие=Вторник>Вторник
<OPTION иа!ие=Среда>Среда
COPTION иа1ие=Четверг>Четверг
<OPTION иа!ив=Пятница>Пятница
<OPTION иа!ие=Суббота>Суббота
<OPT ION ualue=Воскресенье>Воскресенье
</SELECT)
<Р align=cei
<INPUT type'
<INPUT type


Какие дни недели Вы
больше всего любите




day=He знаю
с!ау=Суббота
day=Воскресенье


Рис. 12.22. Благодаря параметру multiple из списка можно
выбрать сразу несколько значений

Для того чтобы выбрать несколько пунктов из такого списка, использу-
ется стандартный подход Windows: если эти пункты следуют подряд, вы-
бираем первый, нажимаем клавишу <Shift> и, удерживая ее, выбираем
последний пункт. Если же пункты разбросаны, выбираем их в произ-
вольном порядке, удерживая нажатой клавишу <Ctrl>.
При разработке электронной формы рекомендуется придерживаться
следующего правила: то, что посетитель страницы видит на экране од-
новременно, должно представлять собой законченный блок информа-
ции. По возможности, разумеется: если вам это не удастся, никто не по-
даст на вас в суд. Однако мало кому понравится пользоваться прокрут-
кой только для того, чтобы добраться до кнопки отправки. Тому, чтобы
форма выглядела эстетично и чтобы ею было удобно пользоваться,
очень способствует рациональная комбинация различных списков.

209
Формы
Резюме
Электронная форма — эффективное средство, благодаря которому HTML-
страница превращается из "пассивной", лишь предоставляющей информацию
пользователю, в "активную", позволяющую принять информацию от пользовате-
ля и передать ее для обработки.
Способ обработки и передачи данных определяется дескриптором <FORM>, внутри
которого и заключается код формы. Средство обработки определяется параметром ac-
tion, метод передачи — параметром method, а тип кодирования — параметром enctype.
Внутреннее содержание формы можно разделить на две части: активное и пас-
сивное. Пассивными элементами формы являются все комментирующие и деко-
ративные элементы, которые могут там содержаться. Это обычные составляющие
HTML-страницы.
Активные элементы формы предназначены для ввода данных. Это строки и
поля ввода, списки и кнопки. У каждого активного элемента формы — как и у
всей формы — есть два основных параметра — name и value. Первый определяет
имя элемента, по которому его можно отличить от других элементов формы, вто-
рой — значение, которое передается через этот элемент. Большинство активных
элементов формы описывается дескриптором <INPUT>, а их вид определяется зна-
чением параметра type. Так, значение text соответствует строке ввода, file —
строке выбора файла, password — строке ввода пароля; значения submit, reset и
button определяют кнопки различных видов, а значения checkbox и radio — два
типа списков: список вариантов и список-переключатель, соответственно.
Еще два вида элементов ввода, используемых в формах, создаются с помощью
следующих дескрипторов. Дескриптор <TEXTAREA> позволяет создавать поля ввода —
прямоугольные окна с собственными средствами прокрутки, в которые можно вво-
дить произвольный текст (без форматирования). Дескриптор <TEXTAREA> — парный.
Внутри него помещается текст, который содержится в поле ввода по умолчанию.
Наконец, еще один распространенный элемент электронных форм — раскры-
вающийся список — создается с помощью конструкции HTML, образуемой деск-
рипторами <SELECT> и <OPTION>. Первый является парным и заключает в себе весь
список, вторые предназначены для создания отдельных пунктов. Списки, создан-
ные таким образом, могут состоять из любого количества строк (если список со-
стоит из одной строки, то он является "раскрывающимся"), а также, в зависимо-
сти от параметра multiple, позволяют выбрать один или несколько элементов.
Данные, вводимые посредством формы, обрабатываются не средствами HTML.
Они могут передаваться по электронной почте или непосредственно программе-
обработчику. Язык, на котором может быть написана такая программа, значения
не имеет. В частности, для обработки таких данных могут использоваться сцена-
рии на языке JavaScript.




Глава 12
210
Тест
1. Какой или какие из следующих фрагментов HTML-кода содержат ошибки?
а) <FORM action=mailto:mymail?mail.dom method=post enctype=application/
x-www-form-urlencoded>
</FORM>
б) <FORM action=mailto:mymail@mail.dom method=get enctype=text/plain>

</FORM>
в) <FORM action=mailto:mymail@mail.dom method=post enctype=text/plain>
</FORM>
r) <FORM action=mailto:mymail§mail.dom method=post enctype=plain>

</FORM>
д) <FORM action=mailto:mymail§mail.dom method=post enctype=text>

</FORM>
2. Какой или какие из следующих фрагментов HTML-кода содержат ошибки?
а) <INPUT type=text value="Введите текст:">
б) <INPUT type=text name=itext value="Введите текст:">
в) <INPUT type=text name=itext> Введите текст </INPUT>
г) Введите текст: <INPUT type=text name=itext>
3. Сколько символов можно ввести в следующей строке и какова видимая
длина этой строки?
<INPUT type=text name=itext size=10 maxlength=20>
а) 10 и 20, соответственно
б) 20 и 10, соответственно
4. Какой или какие из следующих фрагментов HTML-кода кнопки отправки
данных содержат ошибки?
а) <INPUT type=button value=submit>
б) <INPUT type=submit value=OK>
в) <INPUT type=submit name=OK>OK</lNPUT>
r) <INPUT type=submit name=OK>
д) <INPUT type=iraage src=ok.gif value=OK>
5. Какой или какие из следующих фрагментов HTML-кода кода обнуления
данных формы содержат ошибки?
а) <INPUT type=button value=reset>
б) <INPUT type=reset value=Cancel>

Формы 211
в) <INPUT type=reset name=Cancel>Cancel</INPUT>
г) <INPUT type=reset name=Cancel>
д) <INPUT type=image src=cancel.gif value=Cancel>
6. Какой или какие из следующих фрагментов HTML-кода содержат ошибки?
а) <ТЕХТАКЕА>Введите длинный текст</ТЕХТАКЕА>
б) <TEXTAREA name=ltext>BBeflHTe длинный текст</ТЕХТАКЕА>
в) <TEXTAREA name=ltext уа!ие=Введите длинный текст >Введите длинный
текст</ТЕХТАКЕА>
г) <TEXTAREA name=ltext уа!ие=Введите длинный текст></ТЕХТАКЕА>
д) <TEXTAREA name=ltext уа!ие=Введите длинный текст>
7. Какой или какие из следующих списков позволяют выбрать несколько ва-
риантов?
а) <INPUT type=checkbox пагае=у!>Вариант 1
<INPUT type=checkbox пате=у2>Вариант 2
<INPUT type=checkbox пате=уЗ>Вариант 3
б) <INPUT type=checkbox narae=vl checked>BapnaHT 1
<INPUT type=checkbox name=v2 checked>BapnaHT 2
<INPUT type=checkbox name=v3 checked>BapnaHT 3
в) <INPUT type=radio name=vl checked>BapnaHT 1
<INPUT type=radio name=vl checked>BapnaHT 2
<INPUT type=radio name=vl checked>BapnaHT 3
r) <INPUT type=radio пате=у!>Вариант 1
<INPUT type=radio name=vl>BapnaHT 2
<INPUT type=radio пате=у!>Вариант 3
д) <SELECT name=vl>
<OPTION value="Вариант 1">
<OPTION уа!ие="Вариант 2">
<OPTION value="BapnaHT 3">
</SELECT>
е) <SELECT name=vl>
<OPTION уа!ие="Вариант 1" checked>
<OPTION уа!ие="Вариант 2" checked>
<OPTION уа!ие="Вариант 3" checked>
</SELECT>
ж) <SELECT name=vl checked>
<OPTION value="Вариант 1">
<OPTION value="Вариант 2">
<OPTION value="Вариант 3">
</SELECT>
з) <SELECT name=vl multiple>
<OPTION value="Вариант 1">
<OPTION уа!ие="Вариант 2">
<OPTION уа!ие="Вариант 3">
</SELECT>

212 Глава 12
Глава 13

Структура HTML-документа
В этой главе...

4 Основные параметры Web-страницы
4 Отступы от края окна
4 Прокрутка
4 Цвет фона
4 Цвет текста



Основные параметры Web-страницы
Как мы уже знаем, броузер быстро распознает содержимое файла как HTML-
код, если расширение этого файла — htm или html (см. Введение). Однако, вообще
говоря, документ HTML имеет более четкую структуру.
Начало и конец HTML-кода обозначаются дескрипторами <HTML> и </HTML>:
<HTML>
Содержимое Web-страницы
</HTML>
Впрочем, практически все современные броузеры сами "понимают", где начи-
нается и, где заканчивается код Web-страницы. Тем не менее правильно структу-
рировать ее не только желательно, но зачастую и необходимо.
Хорошая Web-страница делится на две части: тело — то, что выводится в окне
броузера, и заголовочную часть — раздел, в котором содержится справочная ин-
формация, используемая броузером и различными службами Internet, такими как
поисковые серверы. Для того чтобы отделить тело от заголовка, используются де-
скрипторы <HEAD> и <BODY>:
<HTML>
<HEAD>
<!— Заголовок Web-страницы —>
</HEAD>
<BODY>
<!-- Тело Web-страницы -->
</BODY>
</HTML>
Вообще-то, без дескриптора <HTML> можно было бы обойтись. Броузеры по-
следних поколений действуют в соответствии с известной юридической форму-
лой — все, что не запрещено, разрешено — и добросовестно выводят в окно все,
что не "забаррикадировано" специальными дескрипторами.
Дескриптор <BODY> не только структурирует HTML-документ, но и позволяет
определить его основные свойства — такие, которые распространяются на всю
страницу. Если эти параметры не указывать, то соответствующие свойства стра-
ницы — отступы, цвета и др. — будут такими, какие заданы по умолчанию. А те-
перь рассмотрим эти параметры подробнее.

HTML-страницы, содержащие фреймовую структуру, не нуждаются в
дескрипторах <HTML> и <BODY>. Подробнее об этом читайте в главе 11.



Отступы от края окна
Для Web-страницы поля, или отступы — то же, что и поля для обычной, пе-
чатной страницы. Расстояния от текста до краев листа... простите, окна броузера.
Только измеряются они не в миллиметрах, а в пикселях или в процентах.
Горизонтальные отступы задаются с помощью трех параметров —leftmargin,
rightmargin и marginwidth. Те, кто учил в школе английский, уже догадались -
первый определяет ширину левого отступа, второй — правого и третий — обоих
горизонтальных отступов. Выходит, если поля разные, пользуемся параметрами
rightmargin и marginwidth, а если одинаковые, — то marginwidth?
Как бы не так. Как вы уже могли заметить, стандарт HTML трактуется разны-
ми разработчиками довольно широко — в том смысле, что они игнорируют от-
дельные предусмотренные стандартом параметры и даже целые дескрипторы и
создают вместо них свои. Так вышло и с параметрами отступов: в Internet Ex-
plorer используются rightmargin и leftmargin, а в Mozilla — marginwidth. Таким
образом, в IE мы получаем дополнительную "степень свободы" - возможность
задавать правый и левый отступы разной ширины.

Броузеры игнорируют незнакомые параметры. Web-дизайнеры пользу-
ются этим свойством, задавая в дескрипторе <BODY> параметры для обоих
типов броузеров — и IE, и Mozilla (рис. 13.1).

А как обстоят дела с отступами в остальных броузерах? Ответ здесь один:
пробуйте и узнаете. Не зря Web-дизайнеры хранят на своих компьютерах
по несколько версий разных броузеров и пробуют, пробуют, пробуют...

Вертикальные отступы задаются аналогично. В Internet Explorer верхний и ниж-
ний отступы определяются соответственно параметрами topmargin и bottommargin. В
броузерах Mozilla они одинаковые и определяются параметром marginheight.

<<

стр. 7
(всего 11)

СОДЕРЖАНИЕ

>>