Фрагмент HTTP-запроса при передаче JPEG-файла
на обработку серверному скрипту при помощи метода POST
Анализировать данные, переданные подобным образом, значительно
сложнее, нежели разобрать пользовательские параметры, представленные в
кодировке URL. Мы, разумеется, не будем даже касаться этого — для общего
развития я просто приведу на рис. 6.15 внешний вид содержимого тела HTTP-
сообщения запроса, включающего в себя «внутренности» отправленного
пользователем графического файла в формате JPEG. Помимо собственно
Глава 6. Формы в HTML
311
файла (содержимое поля с именем picture), передаются данные еще трех
текстовых полей С именами login, password И comment.
Группировка элементов форм
В современной практике веб-разработки не так уж и редко встречаются
обширные формы, насчитывающие десятки полей различных типов. Сказанное
относится в первую очередь к административным интерфейсам продвинутых
систем управления содержанием сайтов (Content Management Systems, CMS),
в просторечии — «движков».
Само по себе количество элементов, задействованных в составе формы, вряд
ли способно сколько-либо заметно затруднить работу с ней. Основная
причина неудобства подавляющего большинства встречающихся на просторах
Всемирной паутины веб-форм кроется в недостаточно продуманной
организации их интерфейса с точки зрения взаимного расположения элементов,
ясности текстовых пояснений к полям и т. д.
Теги и , предусмотренные в HTML, позволяют
дополнительно структурировать (как логически, так и визуально) сложные формы,
разбив их на относительно небольшие и однородные тематические группы
элементов.
В случае применения означенных тегов родственные поля веб-формы
заключаются в контейнер
. Элемент
,
содержащий текстовый заголовок той или иной группы элементов, должен
следовать сразу же за открывающим тегом
Сказанное демонстрируется на примере следующей веб-формы:
Внешний вид веб-формы, использующей тематическую группировку
элементов интерфейса, демонстрируется на рис. 6.16.
Оформление HTML-форм
«Академический» облик веб-формы, описанной в листинге 6.13, равно как и
внешний вид всех остальных форм, рассмотренных ранее в этой главе, лишен
индивидуальности.
Как и следовало ожидать, на помощь приходит CSS.
В отличие от таблиц, однако, для веб-форм в CSS2 не определено каких бы то
ни было специальных свойств, поэтому обсуждать здесь почти нечего —
читателю и так уже все наперед известно из глав 3 и 4.
Сделаю лишь несколько замечаний.
Поскольку множество разнородных элементов веб-форм задается одним и
тем же тегом
, при составлении CSS-правил, описывающих внешний
вид полей, возникает соблазн использовать селекторы атрибутов.
Глава 6. Формы в HTML
313
ЩЩ\&® ^\т^з&г^,щг
Регистрация нового участника тайного
общества борцов за веб-стандарты
-Персональная информация —
Ф.И.О.:
L . J
Желаемый логик:
Желаемый nai
проль:
Адрес электронной почты:
Немного о себе:
г-Личные прешючтения
Каким браузером вы предпочитаете пользоваться?
О Microsoft Internet Explorer
О Opera
О MozilkFiiefox
Какая операционная система вам более всего по душе?
О Microsoft Windows
О MacOS
С Linux
Рис. 6.16. Форма из листинга 6.13
Так, например, в соответствии со спецификацией CSS2, правило
input[type] {…}
будет применяться ко всем элементам, определенным при помощи тегов
, для которых указаны атрибуты type, принимающие любые значения.
314 Часть II.
|
5th Фев 2011
|
Теги:
|