/>1. Создание HTML-таблиц
1.1 Средствоформатирования Web-страниц – таблицы
Одним изнаиболее мощных и широко применяемых в HTML средств являютсятаблицы. В HTML таблицы используются не только традиционно, как методпредставления данных, но и как средство форматирования Web-страниц.
Первые версииязыка HTML не предусматривали специальных средств для отображения таблиц,так как была в основном предназначена для написания простого текста. Сразвитием сфер применения HTML-документов стала актуальной задача представленияданных, для которых типично наличие ряда строк и столбцов. Создание документов,содержащих выровненные по колонкам данные, на первых порах осуществлялосьиспользованием преформатированого текста, внутри которого необходимовыравнивание обеспечивалось введением нужного количества пробелов. Выравниваниевручную существенно замедляло создание документов.
Использованиетаблиц не ограничивается только данными, состоящими из рядов и колонок. Однимиз применений является организация расположения разнообразных данных настранице, которые могут состоять из простого текста, изображений, других таблици т.д.
Рассмотримсначала минимальный набор тэгов и их параметров, необходимый и достаточный длясоздания несложных таблиц, затем перейдем к их детальному описанию.
Описаниетаблиц должно располагаться внутри раздела документа . Документ можетсодержать произвольное число таблиц, причем допускается вложенность таблиц другв друга. Каждая таблица должна начинаться тэгом и завершаться тэгом. Внутри той пары тэгов располагается описание содержимоготаблицы. Любая таблица состоит из одной или нескольких строк, в каждой изкоторых задаются данные для отдельных ячеек.
Общий вид таблицы:
…заголовоктаблицы…
перваяячейка втораяячейка
первая ячейка вторая ячейка
Атрибутыметки TABLE не обязательны. По умолчанию, таблица выводится без рамки. Какправило, размер ячеек таблицы устанавливается автоматически, чтобы наилучшим образомразместить содержимое. Однако можно установить ширину таблицы с помощьюатрибута WIDTH. Атрибуты BORDER, CELLSPACING и CELLPADDING предоставляютдополнительные возможности для контроля за внешним видом таблицы. Заголовокразмещается над или под таблицей в зависимости от значения атрибута ALIGN.
Горизонтальныйряд ячеек определяется элементом TR, закрывающая метка не обязательна. Ячейкитаблицы определяются элементами TD (для данных) и TH (для заголовков). Как иTR, эти элементы могут не иметь закрывающей метки. TH и TD могут включатьнесколько атрибутов: ALIGN и VALIGN для выравнивания содержимого ячейки,ROWSPAN и COLSPAN для указания того, что ячейка занимает более одногогоризонтального ряда или колонки. Ячейка таблицы может содержать другие элементыуровня блока и текста, включая формы и другие таблицы.
Для элементаTABLE обязательны открывающая и закрывающая метки. Допустимые атрибуты:
align
Допустимыезначения: LEFT, CENTER и RIGHT. Определяет положение таблицы по отношению кполям документа. По умолчанию установлено выравнивание по левому краю, но этоможно изменить путем включения в документ элемента DIV или CENTER.
width
Приотсутствии этого атрибута ширина таблицы определяется автоматически взависимости от содержимого. Атрибут WIDTH можно использовать для установкификсированной ширины в пикселах (например, WIDTH=212) или в процентах отпространства между левым и правым полем (например, WIDTH= «80%»).
border
Используетсядля указания ширины внешней окантовки таблицы в пикселах (например, BORDER=4).Значение можно установить равным нулю, в результате чего окантовка не будетвидна. В отсутствие этого атрибута окантовка также не должна показываться наэкране. Обратите внимание: некоторые браузеры воспринимают метку точно так же, как BORDER=1.
cellspacing
Втрадиционном издательском программном обеспечении расположенные рядом ячейкитаблицы имеют общую окантовку. В HTML это не так. Каждая ячейка имеетсобственную окантовку. Ширина окантовки ячейки в пикселах устанавливаетсяатрибутом CELLSPACING (например, CELLSPACING=10). Этот атрибут такжеустанавливает расстояние между окантовкой таблицы и окантовками крайних клетоктаблицы.
cellpadding
Устанавливаетрасстояние между окантовкой ячейки таблицы и содержимым ячейки.
ЭлементCAPTION может иметь один атрибут ALIGN со значением ALIGN=TOP или ALIGN=BOTTOM.Соответственно, заголовок таблицы показывается либо над, либо под таблицей.Большинство браузеров по умолчанию показывают заголовок над таблицей.Открывающая и закрывающая метки обязательны. В заголовках тыблиц не разрешаютсяэлементы уровня блока.
Элемент TRоткрывает описание строки таблицы. Закрывающая метка не обязательна. Имеет двастрибута:
align
Устанавливаетгоризонтальное выравнивание в ячейках строки. Допустимые значения: LEFT, CENTERи RIGHT. Действие аналогично атрибуту ALIGN у абзацев.
valign
Устанавливаетвертикальное выравнивание в ячейках строки. Допустимые значения: TOP, MIDDLE иBOTTOM; содержимое ячеек при этом выравнивается по верхнему краю, по центру илипо нижнему краю.
Существуетдва элемента, определяющих ячейки таблицы. TH используется дляячеек-заголовков, а TD – для ячеек с данными. Открывающие метки обязательны,закрывающие – нет. Ячейки могут иметь следующие атрибуты:
nowrap
Этот атрибутзапрещает автоматический перевод текста со строки на строку внутри ячейкитаблицы (например, ). Эффект применения этого атрибутааналогичен использованию объекта вместо пробела по всемусодержимому ячейки.
rowspan
Используетсяс положительным целым значением числа строк таблицы, занятых ячейкой. Поумолчанию принято равным единице.
colspan
Используетсяс положительным целым значением числа колонок таблицы, занятых ячейкой. Поумолчанию принято равным единице.
align
Указываетпринятое по умолчанию выравнивание содержимого ячейки. Имеет приоритет надзначением, установленным атрибутом ALIGN строки таблицы. Допустимые значения теже самые: LEFT, CENTER и RIGHT. Если атрибут ALIGN не указан, принятое поумолчанию выравнивание – по левому краю для и по центру для, однако это можно изменить установкой атрибута ALIGN элемента TR.
valign
Указываетпринятое по умолчанию выравнивание содержимого ячейки. Имеет приоритет надзначением, установленным атрибутом ALIGN строки таблицы. Допустимые значения теже самые: TOP, MIDDLE и BOTTOM. Если атрибут VALIGN не установлен, по умолчаниюпринято выравнивание по центру, однако это можно изменить установкой атрибутаVALIGN элемента TR.
width
Указываетрекомендуемую ширину содержимого ячейки в пикселях. Значение используетсятолько в случаях, когда оно не противоречит требованиям к ширине других ячеек вколонке.
height
Указываетрекомендуемую высоту содержимого ячейки в пикселях. Значение используетсятолько в случаях, когда оно не противоречит требованиям к высоте других ячеек встроке.
Таблицы, какправило, показываются на экране «приподнятыми» над поверхностью страницы, аячейки – «вдавленными» в тело таблицы. Ячейки выделяются окантовкой только еслив них есть содержимое. Если содержимое ячейки состоит только из пробелов,ячейка считается пустой, за исключением случаев, когда в ней есть хотя бы одинобъект .1.2 Ячейки таблицы: элементы />TH и />TD
Определения атрибутов
/>headers = idrefs
В этоматрибуте указывается список ячеек заголовков, предоставляющих заголовочнуюинформацию для текущей ячейки данных. Значением этого атрибута являетсяразделенный пробелами список названий ячеек; имена ячейкам должны даваться спомощью атрибута id.Авторы обычно используют атрибут headersс целью помочь невизуальным агентам пользователей в генерации заголовков ячеекданных (например, заголовок произносится перед прочтением данных ячейки), ноэтот атрибут может также использоваться вместе с таблицами стилей. См. также атрибутscope.
/>scope = имя областидействия
Этот атрибутопределяет набор ячеек данных, для которых заголовочная информация задаетсятекущим заголовком. Этот атрибут может использоваться вместо атрибута ,особенно в простых таблицах. Если этот атрибут используется, он должен иметьодно из следующих значений:
· row: В ячейке представлена заголовочная информация для оставшейсячасти строки, в которой содержится эта ячейка.
· col: В текущей ячейке представлена заголовочная информация дляоставшейся части столбца, в котором содержится эта ячейка.
· rowgroup: В ячейке представлена заголовочная информация для оставшейся,в которой содержится эта ячейка.
· colgroup: В ячейке представлена заголовочная информация для оставшейся,в которой содержится эта ячейка.
/>abbr = текст
Этот атрибутследует использовать для представления сокращенной формы содержимого ячейки; онможет генерироваться агентами пользователей в подходящий момент вместосодержимого ячейки. Сокращенные имена должны быть короче, и агентыпользователей могут повторять их. Например, синтезаторы речи могут генерироватьсокращенные заголовки, относящиеся к определенной ячейке, перед генерациейсодержимого ячейки.
/>axis = cdata
Этот атрибутможет использоваться вместо ячейки в концептуальных категориях, которая можетиспользоваться для формирования axes в n-мерном пространстве. Агентыпользователей могут давать пользователям доступ к этим категориям (например,пользователь может запрашивать у агента все ячейки, принадлежащие копределенной категории, агент пользователя может представлять таблицу в формеоглавления и т.д.). Подробнее см. в разделе о. Значением этого атрибутаявляется список имен категорий, разделенных запятыми.
/>rowspan = число
Этот атрибутопределяет число строк, spanned текущей ячейкой. По умолчанию используетсязначение один («1»). Значение ноль («0») означает, что ячейка spans все строкиот текущей до последней строки таблицы.
/>colspan = число
Этот атрибутопределяет число столбцов, spanned текущей ячейкой. По умолчанию используетсязначение один («1»). Значение ноль («0») означает, что ячейка spans все столбцыот текущего до последнего столбца таблицы.
/>nowrap
Нежелателен. Если этот логическийатрибут используется, он сообщает визуальным агентам пользователей онеобходимости отключить автоматическое разбиение текста для этой ячейки. Дляразбиения строк вместо этого атрибута должны использоваться. Примечание.При невнимательном использовании этот атрибут может привести к тому, что ячейкибудут очень широкими.
/>width = пикселы
Нежелателен. Этот атрибут даетагентам пользователей рекомендуемую ширину ячейки.
/>height = пикселы
Нежелателен. Этот атрибут
1.3Вложенные таблицы
Отдельныеячейки таблицы могут содержать практически любые теги языка и данныеразрешенные в разделе документа. В том числе, внутри ячейки таблицыможет быть целиком размещена другая таблица. Такие таблицы называют вложенными.Правила их построения не отличаются от построения таблиц и не нуждаютсяотдельном описании.
Приведемпример HTML – кода вложенной таблицы:
Города Республики Дагестан
ГородаРеспублики Дагестан
Н – Населениегорода (тыс. жит., 1992 г.)
Р –расстояние от Махачкалы (км)
Поселки,подчиненные Махачкале ПоселокHP
Семендер 13.650
Хушет144.626
Кяхулай48
Редукторный 42.040
Сепараторный 25.4 30
5 Поселок 83.829
Гур-ГурАул 95.124
Ленинкент 34.935
Все поселки,подчиненныеадминистрацииМахачкалы, имеютпрямые городскиеномера.
Поселки областногоподчинения
ПоселокHP
Кизляр 21.6 245
Бабаюрт 50.3122
Кизилюрт 32.924
Буйнакск 80.924
Каспийск 1.0159
Дербент 80.946
Избербаш 11.9147
Южно-Сухокумск 5.9157
Гунибский 51.5138
Курахский 53.8115
Левашинский 23.855
Кулинский 27.3244
Дербентский 41.8 139
(продолжение таблицы)
ПоселокHP
Кахиб 4.785
Телетль 11.2141
Терекли-Мектеб 22.940
Татархан 25.1246
Кирка 23.1285
Курах 6.7137
Гимры 20.5145
Ахты 15.8201
Ксумкент 42.6192
Акуша 57.681
Сивух 72.0200
Куллар 33.853
Даркуш 12.564
2. Фреймы и формы
2.1Понятие фреймовФреймыпозволяют разбить окно просмотра браузера на несколько прямоугольныхподобластей, располагающихся рядом друг с другом. В каждую из этих подобластей можнозагрузить отдельный HTML – документ, просмотр которогоосуществляется независимо от других. Между фреймами, также как и междуотдельными окнами браузера, при необходимости можно организовать взаимодействие,которое заключается в том, что выбор ссылки в одном из фреймов может привести кзагрузке нужного документа в другой фрейм или окно браузера.Возможностьработы с фреймами впервые реализована в браузере Netscape 2.0. Следующаяверсия браузера Netscape 3.0 обогатила возможности фреймов,добавив несколько дополнительных параметров к основным тэгам описания структурыфреймов. Браузер Microsoft Internet Explorer поддерживаетфреймы, начиная с версии 3.0, а также предоставляет уникальную возможность созданияплавающих фреймов.РазработчикамиHTML-документов предоставляется довольно богатый выбор отображенияинформации на страницах. Текстовая и графическая информация может бытьупорядочена и организована при помощи списков, таблиц или просто с помощью параметроввыравнивания, задания горизонтальных линий, разделения на абзацы. Иногда этихвозможностей оказывается недостаточно и тогда приходится разбивать окнопросмотра браузера на отдельные области или фреймы.Этопредоставляет дизайнерам возможность оставлять некоторую информацию видимой, вто время как другая информация прокручивается или заменяется. Например, в одномокне в одном фрейме может отображаться статический баннер, во второмнавигационное меню, а в третьем – сам документ, который можно прокручивать илипереходить к другому с помощью навигации во втором фрейме.
Вотпростой документ с использованием фреймов:
Простой документ с фреймами
В этом документе содержится:
Миленький текстик
Славный текст
Еслиагент пользователя не может представлять фреймы или сконфигурирован так, чтобы неделать этого, он должен генерировать содержимое элемента NOFRAMES.2.2 Расположение фреймов
ДокументHTML, в котором описывается компоновка фреймов (называемый />документом с фреймами), выглядитне так, как документ HTML без фреймов. Стандартный документ имеет один раздел HEAD и один раздел BODY. Документ сфреймами имеет раздел HEADи раздел FRAMESET,который заменяет раздел BODY.
Вразделе FRAMESETзадается расположение фреймов в основном окне агента пользователя. Кроме того,в разделе FRAMESETможет присутствовать элемент NOFRAMESдля агентов пользователей, не поддерживающих фреймы или сконфигурированных так,чтобы их не показывать.
Элементы,обычно помещаемые в раздел BODY,не должны присутствовать до первого элемента FRAMESET, иначе элемент FRAMESET будетигнорироваться.
Элемент/>FRAMESET
Определения атрибутов
/>rows = multi-length-list
Этот атрибутопределяет расположение горизонтальных фреймов. Это разделенный запятыми списокпикселей, процентов и относительных длин. По умолчанию используется 100%, чтоозначат одну строку.
/>cols = multi-length-list
Этот атрибутопределяет расположение вертикальных фреймов. Это разделенный запятыми списокпикселей, процентов и относительных длин. По умолчанию используется 100%, чтоозначат один столбец.
Элемент/>FRAMESETопределяет макет основного окна пользователя в виде прямоугольных пространств.
Установкаатрибута rowsопределяет число горизонтальных отрезков пространства в наборе фреймов.Установка атрибута colsопределяет число вертикальных отрезков. Для создания сетки можно установить обаатрибута одновременно.
Еслиатрибут rowsне установлен, каждый столбец занимает всю длину страницы. Если атрибут cols не установлен,каждая строка занимает всю ширину страницы. Если не установлен ни один из этихатрибутов, фрейм занимает всю страницу.
Фреймысоздаются в направлении слева направо для столбцов и сверху вниз для строк.Если указаны оба атрибута, разделы окон создаются слева направо в верхнейстроке, слева направо во второй строке и т.д.
Впервом примере экран разделяется горизонтально на две части (то есть создаютсяверхняя и нижняя части).
…продолжение определения…
Вследующем примере создается три столбца: второй имеет фиксированную ширину 250пикселей (это полезно, например, для представления изображения известнойширины). Первый фрейм получает 25% оставшегося пространства, а третий – 75%.
…продолжение определения…
Вследующем примере создается сетка 2x3.
…продолжение определения…
Дляследующего примера предположим, что окно браузера имеет высоту строго 1000пикселей. Первый раздел получает 30% общей высоты (300 пикселей). Второй имеетвысоту ровно 400 пикселей. Остается 300 пикселей на два другие фрейма. Длячетвертого фрейма задана высота «2*», так что он должен быть вдвое вышетретьего, для которого заданы высота «*» (эквивалентно 1*). Таким образом,третий фрейм будет иметь высоту 100 пикселей, а четвертый – 200.
…продолжение определения…
Абсолютныедлины, если они не дают в сумме 100% реально доступного пространства, должныкорректироваться агентом пользователя. Если указана длина менее фактической,оставшееся пространство должно равномерно распределяться между всеми разделами.Если указана длина, превышающая фактическую, каждый раздел должен уменьшаться взависимости от того, какую часть пространства он занимает./>2.3 Вложенныенаборы фреймов
Числоуровней вложенности фреймов не ограничено. В следующем примере внешний элемент FRAMESET разделяетдоступное пространство на три равных столбца. Внутренний элемент FRAMESET разделяетвторую область на две строки неравной высоты.
…содержимое первого фрейма…
…содержимое второго фрейма, первая строка…
…содержимое второго фрейма, вторая строка…
…содержимое третьего фрейма…
Элемент />FRAME
Определения атрибутов
/>name = cdata
Назначает имятекущему фрейму. Это имя может использоваться в качестве цели в последующихссылках.
/>longdesc = uri
Ссылка надлинное описание фрейма. Это объявление должно дополнять краткое описание,задаваемое атрибутом title,и может быть особенно полезно для невизуальных агентов пользователей.
/>src = uri
Определяетместонахождение начального содержимого фрейма.
/>noresize
Если этотатрибут присутствует, он сообщает агенту пользователя, что размеры фреймаизменять нельзя.
/>scrolling = auto|yes|no
Этот атрибутзадает информацию о прокрутке фрейма. Возможные значения
· auto: При необходимостипредоставлять возможности прокрутки. Это значение используется по умолчанию.
· yes: Всегда предоставлять возможностипрокрутки.
· no: Не предоставлять возможности прокрутки.
/>frameborder = 1|0
Этот атрибутпредоставляет агенту пользователя информацию о границе фрейма. Возможныезначения:
· 1: Агент пользователя должен изобразитьразделитель между этим фреймам и всеми прилежащими фреймами. Это значениеиспользуется по умолчанию.
· 0: Агент пользователя не должен отображатьразделитель. Обратите внимание, что разделители могут все равно отображаться,если они заданы в других фреймах.
/>marginwidth = пикселы
Этот атрибутзадает пространство, оставляемое во фрейме в качестве левого и правого полей.Значение должно превышать один пиксель. Значение по умолчанию зависит от агентапользователя.
/>marginheight = пикселы
Этот атрибутопределяет верхнее и нижнее поля в фрейме. Значение должно превышать одинпиксель. Значение по умолчанию зависит от агента пользователя.
Атрибуты, определяемые в другом месте
· title ()
· target ()
ЭлементFRAMEопределяет содержимое и вид одного фрейма.
Атрибутsrcопределяет исходный документ, содержащийся в фрейме.
Вследующем примере документа HTML:
«_THE_LATEST_VERSION_/frameset.dtd»>
Документ с фреймами
Агентпользователя должен загружать каждый файл в отдельный раздел. Содержимое фреймаи его определение не должны находиться в одном документе.2.4 />Определениецели фрейма
Определения атрибутов
/>target = frame-target
Задает имяфрейма, в котором должен открываться документ.
Назначаяфрейму имя с помощью атрибута name,авторы могут ссылаться на него как на «target» для ссылок, определяемый другимиэлементами. Атрибут targetможет устанавливаться для элементов, создающих ссылки (A, LINK),навигационных карт (AREA)и форм (FORM).
Информациюо распознаваемых именах фреймов Вы можете найти в разделе о.
Вэтом примере показано, как цели обеспечивают динамическое изменение содержимогофрейма. Сначала определим набор фреймов в показанном здесь документе frameset.html:
«_THE_LATEST_VERSION_/frameset.dtd»>
Документ с фреймами
Затем в файле init_dynamic.html мы будем ссылаться на фрейм с именем «dynamic».
«_THE_LATEST_VERSION_/frameset.dtd»>
Документ с якорями с определенными целями
…начало документа…
Теперь можно перейти к
слайду 2.
…продолжение документа…
Все отлично. Переходим к
слайду 3.
Активизациялюбой из ссылок приведет к открытию нового документа во фрейме с именем «dynamic»,в то время как в другом фрейме, «fixed», сохраняется исходное содержимое.
/>Примечание.Определение наборафреймов никогда не изменяется, но содержимое одного из фреймов можетизменяться. При изменении исходного содержимого одного из фреймов определениенабора фреймов более не отражает текущего состояния фреймов. В настоящий моментневозможно кодировать полностью состояние набора фреймов в URI. Таким образом,многие агенты пользователей не позволяют пользователям вносить наборы фреймов взакладки.
/>Наборы фреймов могут затруднять переход впередили назад по списку просмотренных в агенте пользователя страниц.
Есливо многих ссылках в документе используется одна и та же цель, можно указать ееодин раз и использовать везде с помощью атрибута target каждого элемента. Это делаетсяс помощью установки атрибута targetэлемента BASE.
Вернемсяк предыдущему примеру и определим информацию о цели в элементе BASE и удалим ее изэлементов A.
«_THE_LATEST_VERSION_/frameset.dtd»>
Документ с определением цели в элементе BASE
…начало документа…
Теперь Вы можете перейти к слайду 2.
…продолжение документа…
Все отлично. Переходим к
слайду 3.
Агентыпользователей должны определять целевой фрейм, в который должен загружатьсясвязанный ресурс в соответствии со следующими приоритетами (от высшего книзшему):
1. Еслив элементе установлен атрибут targetи используется известный фрейм, при активизации элемента (то есть щелчке нассылки или обработке формы) назначаемый элементом ресурс должен загружаться вуказанном целевом фрейме.
2. Еслидля элемента не установлен атрибут target,а в элементе BASEон установлен, фрейм определяется атрибутом target элемента BASE.
3. Еслини в самом элементе, ни в элементе BASEцель не указана, назначенный элементом ресурс должен загружаться во фрейм, вкотором содержится сам элемент.
4. Еслив атрибуте targetуказан неизвестный фрейм F, агент пользователядолжен создать новое окно и фрейм, назначить фрейму имя F и загрузить назначаемый элементом ресурс в новый фрейм.
Агентыпользователей могут обеспечивать для пользователей механизм переопределенияатрибута target.
2.5 Альтернативноесодержимое
Авторыдолжны указывать альтернативное содержимое для агентов пользователей, неподдерживающих фреймы или сконфигурированных так, чтобы не отображать их.
ЭлементNOFRAMESзадает содержимое, которое должно отображаться, только если не отображаютсяфреймы. Агенты пользователей, поддерживающие фреймы, должны отображатьсодержимое объявления NOFRAMES,только если они сконфигурированы так, чтобы не отображать фреймы. Агентыпользователей, не поддерживающие фреймы, должны отображать содержимое элемента NOFRAMES в любомслучае.
ЭлементNOFRAMESможно использовать в разделе FRAMESETдокумента с фреймами. Например:
Это Версия документа без фреймов.
Атрибутlongdescпозволяет авторам сделать документы с использованием фреймов более доступнымидля людей, использующих невизуальные агенты. В этом атрибуте назначаетсяресурс, предоставляющий длинное описание фрейма. Авторам следует обратитьвнимание, что длинные описания, связанные с фреймами, прикрепляются к фрейму,а не к его содержимому. Поскольку содержимое может изменяться, исходное длинноеописание, скорее всего, перестанет соответствовать содержимому фрейма. Вчастности, не следует включать изображение как единственное содержимое фрейма.
Вследующем документе с фреймами описываются два фрейма. В левом фрейме находитсясодержание, а в правом сначала – изображение устрицы:
«_THE_LATEST_VERSION_»>
Плохо составленный документ с фреймами
Обратитевнимание, что изображение включено в фрейм независимо от любого элемента HTML,так что у автора нет другой возможности указать альтернативный текст, кромеатрибута longdesc.Если содержимое правого фрейма изменится (например, пользователь выберет всодержании змею), у пользователя не будет текстового доступа к новомусодержимому фрейма.
Такимобразом, авторы не должны помещать изображение непосредственно во фрейм. Вместоэтого изображение должно включаться в отдельный документ HTML и снабжаться тамсоответствующим альтернативным текстом: 2.6 />Встроенныефреймы: элемент />IFRAME
Определения атрибутов
/>longdesc = uri
Этот атрибутопределяет ссылку на длинное описание фрейма. Это описание должно дополнятькраткое описание, задаваемое атрибутом title,и особенно полезно для невизуальных агентов пользователей.
/>name = cdata
Этот атрибутназначает имя текущего фрейма. Имя может использоваться в качестве цели вссылках.
/>width = длина
Длинавстроенного фрейма.
/>height = длина
Высотавстроенного фрейма.
Атрибуты, определяемые в другом месте
· id, class()
· title ()
· style ()
· name, src, frameborder, marginwidth, marginheight, scrolling ()
· target ()
· align ()
Элемент IFRAME позволяетавторам вставлять фрейм в блок текста. Вставка встроенного фрейма в разделтекста скорее похожа на вставку объекта с помощью элемента OBJECT: оба онипозволяют Вам вставить один документ HTML в другой, оба могут выравниватьсяотносительно окружающего текста и т.д.
Встраиваемаяинформация назначается атрибутом srcэтого элемента. Содержимое элемента IFRAME, с другой стороны, должноотображаться только агентами пользователей, не поддерживающими фреймы илисконфигурированными так, чтобы не поддерживать их.
Дляподдерживающих фреймы агентов пользователей в следующем примере в текст будетпомещен отделенный границей встроенный фрейм.
scrolling= «auto» frameborder= «1»>
[Ваш агент не поддерживает фреймы или сконфигурирован так, чтобы не отображать их. Однако Вы можете просмотреть
этот документ.]
Изменятьразмер встроенных фреймов нельзя.
2.7 Понятие формы
ФормаHTML – это раздел документа, в котором содержатся обычная информация, разметкаи специальные элементы, называемые управляющими элементам (флажки,кнопки с зависимой фиксацией, меню и т.д.), а также метки этих управляющихэлементов. Обычно пользователи «заполняют» форму, модифицируя управляющиеэлементы (вводя текст, выбирая пункты меню и т.д.) перед тем, как предоставитьформу агенту пользователя для обработки (например, на Web-сервер, на почтовыйсервер и т.д.)
/>Пользователивзаимодействуют с формами с помощью именованных управляющих элементов.
«Имя элемента» задается атрибутом name. Областью действия атрибута name дляуправляющего элемента в элементе FORMявляется элемент FORM.
Каждыйуправляющий элемент имеет начальное и текущее значение, оба они являютсясимвольными строками. Информацию о начальных значениях и возможных ограниченияхна значения. В общем случае />«исходное значение»управляющего элемента может задаваться с помощью атрибута value. Однакоисходное значение элемента TEXTAREAзадается его содержимым, а исходное значение элемента OBJECT в формеопределяется реализацией объекта (т.е. лежит вне области, рассматриваемой вданной спецификации).
«Текущее значение» управляющего элемента сначала устанавливаетсяравным начальному значению. Затем текущее значение может изменятьсяпользователем или
/>Начальное значениеуправляющего элемента не изменяется. Таким образом при сбросе формы каждое текущеезначение устанавливается равным начальному значению. Если управляющий элементне имеет начального значения, результат сброса формы непредсказуем.
Когдаформа предоставляется для обработки, с формой пары управляющий элемент-текущеезначение. Передаваемые пары имя/значение называются.
ВHTML определены следующие типы управляющих элементов:
кнопки
Авторы могутсоздавать три типа кнопок:
/>· кнопки отправки: При активизации такой кнопки производится. Вформе может быть несколько кнопок отправки.
/>· кнопки сброса: При активизации такой кнопки для всехуправляющих элементов устанавливаются
/>· прочие кнопки: Для таких кнопок действие по умолчанию неопределено. С атрибутами каждой такой кнопки могут быть связаны. Если происходитсобытие (например, пользователь нажимает кнопку, отпускает ее и т.д.),включается связанный с событием скрипт.
Авторыдолжны определять язык скрипта для кнопок в (в элементе META).
Авторысоздают кнопки с помощью элемента BUTTONили INPUT.Подробнее об определении различных типов кнопок.
флажки
Флажки (икнопки с зависимой фиксацией) – это переключатели вкл./выкл., которые могутпереключаться пользователем. Переключатель «включен», если для управляющегоэлемента установлен атрибут selected.
Приотправке формы могут стать только включенные переключатели. Несколько флажков вформе могут иметь одно и то же Таким образом, например, флажки позволяютпользователям выбрать несколько значений для одного и того же свойства. Длясоздания флажков используется элемент INPUT.
кнопки с зависимой фиксацией
Кнопки сзависимой фиксацией похожи на флажки за исключением того, что, если несколькокнопок используют одно и то же, они являются взаимоисключающими: если однакнопка включена, другие обязательно выключены. Для создания кнопок с зависимойфиксацией используется элемент INPUT.
меню
Предоставляютпользователям варианты на выбор. Меню создается с помощью элемента SELECT, а такжеэлементов OPTGROUPи OPTION.
/>текстовый ввод
Для вводатекста пользователем авторы могут создавать управляющие элементы двух типов.Элемент INPUTсоздает управляющий элемент для ввода текста из одной строки, а элемент TEXTAREA – элементдля ввода текста из нескольких строк. В обоих случаях вводимый текст становитсяуправляющего элемента.
/>выбор файлов
Управляющиеэлементы этого типа позволяют пользователям выбирать файлы, содержимое которыхможет передаваться вместе с формой. Для создания этого управляющего элементаиспользуется элемент INPUT.
/>скрытые управляющие элементы
Авторы могутсоздавать управляющие элементы, не представляемые пользователям, но имеющиезначения, которые передаются с формой. Обычно они используются для храненияинформации между обменом клиент / сервер, которая в противном случае моглабы пропасть вследствие stateless природы протокола HTTP (см.). Для созданияскрытого управляющего элемента используется элемент INPUT.
/>объекты
Авторы могутпомещать в формы общие объекты, так что связанные с ними значения будутпередаваться с другими управляющими элементами. Для создания таких управляющихэлементов используется элемент OBJECT.
Элементы,используемые для создания управляющих элементов, обычно располагаются вэлементе FORM,но могут находиться и за пределами объявления FORM, если они используются дляпостроения интерфейса пользователя. Это обсуждается в разделе о Обратитевнимание, что управляющие элементы за пределами формы не могут быть.
Начальный тег: обязателен, Конечный тег: обязателен
Определения атрибутов
/>action = uri
Задает агентадля обработки формы. Например, значением может быть URI HTTP (для передачиформы в программу) или mailto URI (для отправки формы по электронной почте).
/>method = get|post
Определяетметод HTTP, используемый для передачи. Возможные значения (с учетом регистра) –«get» (по умолчанию) и «post».
/>enctype = content-type
Этот атрибутзадает, используемый для отправки формы на сервер (если для метода используетсязначение «post»). По умолчанию для этого атрибута используется значение />«application/x-www-form-urlencoded».С элементом INPUT,type= «file»должно использоваться значение />«multipart/form-data».
/>accept-charset = список наборовсимволов
Этот атрибутзадает список для ввода данных, которые должны приниматься обрабатывающим этуформу сервером. Значением является разделенный пробелами и / илизапятыми список значений. Сервер должен интерпретировать этот список как списокисключающих или, то есть он должен принимать любую кодировку для загруженногообъекта.
Поумолчанию значением этого атрибута является зарезервированная строка «UNKNOWN».Агенты пользователей могут интерпретировать это значение как кодировкусимволов, используемую для передачи документа, содержащего этот элемент FORM.
/>accept = content-type-list
Этот атрибутопределяет разделенным запятыми список типов содержимого, которые долженкорректно обрабатывать сервер, обрабатывающий форму. Агенты пользователей могутиспользовать эту информацию для отфильтровывания отвечающих спецификации файловпри предложении пользователю выбора файлов для отправки на сервере (если вэлементе INPUTуказано type=«file»).
Атрибуты, определяемые в другом месте
· title ()
· target ()
ЭлементFORMслужит контейнеров для. Он определяет:
· Макетформы (дается содержимым элемента).
· Программу,которая будет обрабатывать заполненную и переданную форму (атрибут action). Получающаяформу программа должна иметь возможность определения пар имя/значение, чтобы ихиспользовать.
· Методотправки данных на сервер (атрибут method).
· Кодировкусимволов, которая должна приниматься сервером для обработки этой формы (атрибутaccept-charset).Агенты пользователей могут рекомендовать пользователю значение атрибута accept-charset и / илине позволять пользователям вводить нераспознаваемые символы.
Формапомимо может содержать текст и разметку (абзацы, списки и т.д.).
Вследующем примере показана форма, которая должна обрабатываться программой «adduser».Эта форма будет отправляться с использованием метода HTTP «post».
…содержимое формы…
Вследующем примере показана отправка формы на адрес электронной почты:
…содержимое формы…
Информациюо том, как агенты пользователя должны подготавливать данные формы для серверови как они должны обрабатывать ответы от сервера Вы можете найти в разделе об.
Начальный тег: обязателен, Конечный тег: запрещен
Определения атрибутов
/>type = text|password|checkbox|radio|submit|reset|file|hidden|image|button
Определяет.По умолчанию используется значение «text».
/>name = cdata
Определяет.
/>value = cdata
Определяет управляющегоэлемента. Этот атрибут не обязателен, если только для атрибута type не установленозначение «radio».
/>size = cdata
Сообщаетагенту пользователя начальную ширину управляющего элемента. Ширина дается в,если для атрибута typeне установлено значение «text» или «password». В этом случае ширина задается вчисле символов (число должно быть целым).
/>maxlength = число
Если дляатрибута typeустановлено значение «text» или «password», этот атрибут определяетмаксимальное число символов, вводимых пользователем. Это число может превышатьуказанный в атрибуте sizeразмер поля; в этом случае агент пользователя должен обеспечивать механизмпрокрутки. По умолчанию число символов не ограничено.
/>checked
Если дляатрибута typeустановлено значение «radio» или «checkbox», этот логический атрибут указывает,что флажок установлен. Агенты пользователей должны игнорировать этот атрибутдля других типов управляющих элементов.
/>src = uri
Если атрибут type имеет значение«image», этот атрибут определяет местоположение изображения, используемое дляпредставления графической кнопки.
Атрибуты, определяемые в другом месте
· title ()
· alt ()
· align ()
определяемыйэлементом INPUT,зависит от значения атрибута type:
text
Создаетэлемент из одной строки.
password
/>Аналогичен значению «text», но вводимый текстпредставляется таким образом, чтобы не отображать символы (например, в видеряда звездочек). Этот управляющий элемент часто используется для ввода паролей.Обратите внимание, что является текст, введенный пользователем, а нетекст, представляемый агентом пользователя.
/>Примечание.Разработчикам приложенийследует обратить внимание на то, что этот механизм обеспечивает только слабуюзащиту. Хотя пароль маскируется агентом пользователя от случайных наблюдателей,он передается на сервер в виде открытого текста, и его может прочесть любойпользователь, имеющий доступ к сети на низком уровне.
checkbox Создает
radio Создает
submit Создает
image Создаетграфическую Значение атрибута srcзадает URI изображения, используемого для представления кнопки. Из соображенийдоступности авторам следует предусматривать для изображения с помощью атрибута alt.
Еслидля щелчка на изображении используется указующее устройство, на серверпередаются форма и координаты щелчка. Значение x измеряется в от левой границыизображения, а значение y – в от верхней границы изображения. В передаваемыеданные включаются последовательности имя.x=значение-x и name.y=значение-y,где «имя» – значение атрибута name,а значение-x и значение-y – значения координат x и yсоответственно.
Еслисервер предпринимает различные действия в зависимости от места щелчка,пользователи неграфических браузеров не смогут воспользоваться этим свойством.По этой причине авторам следует предусматривать альтернативные подходы:
· Использоватьнесколько кнопок отправки (каждая с отдельным изображением) вместо однойграфической кнопки. Можно использовать для управления местоположением этихкнопок таблицы стилей.
· Использоватьи скрипты.
reset Создает кнопку сброса.
button Создает другую кнопку. Агенты пользователейдолжны использовать в качестве метки на кнопке значение атрибута value.
hidden Создает невидимый управляющий элемент.
file Создаетуправляющий элемент выбор файла. Агенты пользователей могут использоватьзначениеатрибута valueв качестве исходного имени файла.
Вследующем фрагменте кода HTML определяется простая форма, позволяющаяпользователям вводить имя, фамилию, адрес электронной почты и пол. В случаеактивизации кнопки отправки форма передается программе, указанной в атрибуте action.
Имя:
Фамилия:
email:
Мужской
Женский
Вследующем примере показано, как содержимое указанного пользователем файла – можетпередаваться вместе с формой. У пользователя запрашивается имя и список именфайлов, содержимое которых должно передаваться с формой. С помощью указаниязначение enctypeдля «multipart/form-data» содержимое всех файлов будет упаковываться дляпередачи в отдельные разделы существующего документа.
enctype= «multipart/form-data»
method= «post»>
Как Вас зовут?
Какие файлы Вы отправляете?
Начальный тег: обязателен, Конечный тег: обязателен
Определения атрибутов
/>name = cdata
Определяет
/>value = cdata
Определяет кнопки.
/>type = submit|button|reset
Объявляет типкнопки. Возможные значения:
· submit: Создает Это значениеиспользуется по умолчанию.
· reset: Создает
· button: Создает
Кнопки,создаваемые с помощью элемента BUTTON,действуют так же, как и кнопки, создаваемые с помощью элемента INPUT, но ониобеспечивают более богатые возможности представления: элемент BUTTON может иметьсодержимое. Например, элемент BUTTON,содержащий изображение, действует и может resemble подобно элементу INPUT, для атрибутаtypeкоторого установлено значение «image», но тип элемента BUTTON может иметьсодержимое content.
Визуальныеагенты пользователей могут представлять кнопки BUTTON рельефно или с эффектом нажатияпри щелчке мыши, в то время как кнопки INPUTмогут представляться только как «плоские» изображения.
Вследующем примере предыдущий пример расширяется, и кнопки и создаются с помощьюэлемента BUTTONвместо элемента INPUT.Используемое для кнопок изображение определяется элементом IMG.
Имя:
Фамилия:
email:
Мужской
Женский
Send
Reset
Помните,что авторам следует предусматривать для элемента IMG.
Недопускается связывать изображение-карту с элементом IMG, содержащимя вэлементе BUTTONelement.
Начальный тег: обязателен, Конечный тег: обязателен
Определения атрибутов элемента SELECT
/>name = cdata
Определяет
/>size = number
Если элемент SELECT представленв виде списка с возможностью прокрутки, этот атрибут определяет число строк всписке, видимых в один момент времени. Визуальные агенты пользователей необязательно должны представлять элемент SELECTв виде списка; они могут использовать другие механизмы – например, выпадающиеменю.
/>multiple
Если этотлогический атрибут установлен, он позволяет выбирать несколько пунктов. Если онне установлен, в элементе SELECTможно выбрать только один вариант.
ЭлементSELECTсоздает. Каждый вариант пункт меню представляется элементом OPTION. Элемент SELECT долженсодержать хотя бы один элемент OPTION.
Элемент/>OPTGROUPelement позволяет авторам логически группировать варианты. Обычно это полезно,если пользователь должен делать выбор в длинном списке вариантов; группысвязанных вариантов проще просматривать и запоминать, чем один длинный списоквариантов. В HTML 4.0 все элементы OPTGROUPдолжны задаваться непосредственно в элементе SELECT (т.е. группы не могут бытьвложенными).
Литература
1. Матросов А.В., Сергеев А.О.,Чаунин М.П. HTML 4.0 – СПб.: БХВ – Петербург, 2007. – 672 с.
2. Финков М.В. Интернет.Шаг второй: от пользователя к профессионалу – Спб.: Наука и Техника, 2002. – 768 с.
3. Левин А.Ш. Самоучительработы на компьютере. 8-е изд. – СПб.: Питер, 2005. – 655 с.
4. Леонтьев В.П. Новейшаяэнциклопедия персонального компьютера 2004 – М.: Олма-Пресс, 2004.
5. Никамин В.А. Цифроваязвукозапись: технологии и стандарты – СПб.: Наука и Техника, 2002.
6. Спецификация HTML 4.0