Параметр BACKGROUND, который уже был показан в примере, приведенном выше, также может использоваться как в тэге <TABLE>, так и в тэгах <TH> и <TD>, определяющих характеристики отдельных ячеек таблицы. Во всех случаях он определяет фоновый рисунок с помощью параметра HREF. В последней версии спецификации HTML в тэге <TABLE> появился параметр COLS (Column Splitting дробление колонок, разбиение столбцов), задающий общее число колонок в таблице. Эта дополнительная информация ускоряет процесс построения таблицы браузером.
При создании заголовочной части таблицы, реже боковика (левой графы таблицы, содержащей данные о строках таблицы) и прографки (составной части таблицы, содержащей сведения, относящиеся к заголовку и боковику), возникает потребность в объединении нескольких ячеек по горизонтали (в строке) или по вертикали в единое целое. Для этого используются параметры ROWSPAN (сцепление строк) и COLSPAN (сцепление столбцов), первый из которых объединяет несколько строк, а второй – столбцов, в одну ячейку. Пример описания такой таблицы приводится ниже.
<TABLE BORDER=10 SELLSPACING=3 CELLPADDING=4 WIDTH=80%>
<CAPTION> <H4> Объединение ячеек в заголовочной части</H4>
<TR> <TH ROWSPAN=2>Заголовок 1</TH><TH COLSPAN=2>Заголовок 2</TH>
<TR><TH>Заголовок 2-1</TH> <TH>Заголовок 2-2 </TH>
<TR ALIGN=CENTER> <TD> 1 <TD> 2 <TD> 3 </TABLE>
Рис. 2.8. Пример отображения таблицы в составе HTML-документа
Показанный ниже рис. 2.9 иллюстрирует отображение в браузере HTML-документа, в теле которого содержится приведенный выше контейнер <TABLE> и </TABLE> со всем его содержимым. По сравнению с таблицей, показанной на рис. 2.8, здесь с помощью тэга <CAPTION> добавлен тематический заголовок, выровненный по центру таблицы. В таблице хорошо видны рамки ячеек и рамка вокруг таблицы в целом. В ячейке "Заголовок 1" объединены 2 строки, а в ячейке "Заголовок 2" – два столбца, что соответствует исходному HTML-коду. В третьей строке, как это часто делают для длинных узких таблиц, указаны номера колонок, что позволяет при переносе на следующую полосу не повторять заголовка целиком. Отметим, что используя параметры ROWSPAN и COLSPAN можно составить многоуровневые заголовки таблиц любой степени сложности.
Рис. 2.9. Пример отображения сложной таблицы в составе HTML-документа
2.7. Фреймовая структура электронного издания
Для удобства работы с электронным изданием окно просмотра браузера может быть принудительно разбито на несколько прямоугольных областей, так называемых кадров (frames), непосредственно примыкающих друг к другу. В каждую такую область можно загружать отдельные HTML-документы, просматривая каждый из них независимо от других. Впервые возможность работы с фреймовыми структурами была реализована в браузере фирмы Netscape версии 2.0. Браузер MS Internet Explorer поддерживает фреймы начиная с версии 3.0.
Фреймовая структура целесообразна для применения в следующих случаях:
✓ для представления информации в нескольких смежных областях окна просмотра браузера, каждая из которых просматривается независимо, чтобы иметь возможность сопоставить эту информацию;
✓ для того, чтобы в определенной области экрана размещалась информация, которая должна постоянно находиться в поле зрения пользователя;
✓ для того, чтобы иметь возможность управлять загрузкой документов в одну из областей, работая в другой области экрана.
В целом же фреймовая структура предоставляет пользователю удобные средства навигации в пределах электронного документа, практически нереализуемые при других вариантах. Видимо по этим причинам фреймовая структура достаточно часто используется для реализации Web-страниц, особенно входных или лицевых страниц сайтов, т. е. тех, на которые пользователь попадает при начальной загрузке этого сайта.
Принципиальное отличие HTML-кода, задающего фреймовую структуру, состоит в том, что вместо тэга <BODY> в нем используется тэг-контейнер <FRANESET> (множество фреймов), параметры которого и определяют разбиение площади окна браузера на отдельные участки или области. Для этого у тэга <FRAMESET> используется два параметра: ROWS и COLS. Параметр ROWS делит окно браузера на горизонтальные полосы (строки), а COLS – на вертикальные (столбцы). Размеры этих полос могут устанавливаться в абсолютных единицах, т. е. пикселах и в относительных – процентах или пропорциональных единицах. Первые два способа задания уже рассматривались ранее и не требуют дополнительных комментариев, 3-й же способ использует некоторое количество звездочек (*), каждая из которых представляет одну часть целого, величина этой части в данном случае определяется как высота окна браузера, деленная на суммарное количество звездочек под знаком параметра ROWS. Все 3 способа деления окна на полосы иллюстрируется приведенными ниже примерами:
<FRAMESET ROWS="10%,80%,10%">
<FRAMESET ROWS="60,480,60">
<FRAMESET ROWS="*,8*,*">
Все 3 варианта с тэгом <FRAMESET> описывают деление экрана на 3 горизонтальные полосы, из которых верхняя и нижняя – одинаковой ширины, а средняя – в 8 раз шире каждой из них. Аналогичным образом описывается и деление на вертикальные полосы с помощью параметра COLS. Для параметров ROWS и COLS возможен и смешанный вариант задания значений, когда используются два или даже все три способа одновременно. Например,
<FRAMESET COLS="70,4*,*,15%">
Тэг задает деление окна на 4 колонки, первая из которых имеет ширину в 70 пикселов, последняя – 15% от ширины окна, ширина 3-й колонки составляет 1/5, а 2-ой – 4/5 от оставшейся части ширины окна.
Внутри контейнера <FRAMESET> и </FRAMESET> могут использоваться лишь вложенные такие же контейнеры или тэги <FRAME> (фреймы, кадры), которые определяют каждый одиночный фрейм. Кстати в теле документа возможно использовать несколько расположенных последовательно тэговконтейнеров <FRAMESET>, в каждом из которых могут быть и вложенные аналогичные контейнеры. Практически же такие конструкции используются крайне редко. Тэг <FRAME> размещается внутри контейнера <FRAMESET> и </FRAMESET>, причем количество тэгов <FRAME> внутри этого контейнера должно в точности совпасть с числом отдельных фреймов, т. е. каждый фрейм должен быть описан своим тэгом <FRAME>. Тэг <FRAME> содержит 6 параметров, а именно: SRC, NAME, MARGINWIDTH (ширина поля, окаймляющего фрейм по ширине), MARGINHEIGHT (поле, обрамляющее фрейм по высоте), SCROLLING и NORESIZE (запрет изменения размера фреймов).
Наиболее важный из перечисленных параметров SRC определяет URL или адрес документа, который изначально загружается в данный фрейм. Обычно это HTML-документ, содержащий и заголовочную часть, и тело. Параметр NAME позволяет присвоить этому фрейму уникальное (не повторяющееся) имя, которое может использоваться для адресации к данному фрейму. В тэге <A>, который рассматривался в разд. 2.5, для адресации к фреймам используется специальный параметр TARGET (адресат, место назначения, приемник), значением которого является имя соответствующего фрейма. Проиллюстрируем сказанное примером:
<FRAME SRC="maintenance.htm" NAME="main_frame">
.....
<A HREF="main_doc.htm" TARGET="main_frame">Основной документ</A>
В представленном примере в основной фрейм (имя этого фрейма – main_frame) исходно был загружен документ maintenance.htm, т. е. оглавление электронного издания. Если же подвести указатель мыши к словам "Основной документ", которые являются указателем ссылки, и щелкнуть левой кнопкой, то в этот фрейм будет загружен новый документ под названием main_doc.htm, который находится в том же самом каталоге и представляет собой содержательную часть данного издания. Таким образом, присвоение фрейму определенного имени позволяет в дальнейшем загружать в него документы.
Параметры MARGIWIDTH и MARGINHEIGHT тэга <FRAME> позволяют установить ширину полей фрейма по ширине и высоте. Отметим, что левое и правое поле имеют одинаковую ширину. То же самое можно сказать и про верхнее и нижнее поля. Значение этих параметров задается в абсолютных единицах – пикселах. Под полями здесь подразумевается свободное пространство, где не могут присутствовать иллюстрации и текст (как и в печатном издании). Минимальное значение этих параметров, устанавливаемое по умолчанию, равно 1 пикселу.
Если содержимое фрейма не помещается в отведенной части окна браузера, для него будут автоматически создаваться полосы прокрутки по нужной координате. Для управления этим процессом служит параметр SCROLLING, который может принимать одно из трех допустимых значений: Yes (да), No (нет) и Auto (автоматически). Последнее значение устанавливается по умолчанию. Значение No запрещает создание полос прокрутки, а Yes приводит к обязательному их созданию, независимо от того, нужны они или нет.
Обычно пользователь может самостоятельно изменять размеры фреймов, так же точно, как и размеры окна браузера, где они размещаются. При таких операциях может нарушаться оптимальное соотношение между размерами фреймов и ухудшаться восприятие информации с экрана компьютера. Для того, чтобы предотвратить эти действия пользователя служит параметр NORESIZE. Для этого параметра не предусмотрено каких-либо значений, но само его использование в описании одного из фреймов запрещает не только изменение размера этого фрейма, но и любого смежного с ним. Приведем несколько примеров с использованием фреймовых структур. Первый пример задает структуру из 5-ти фреймов, которая образуется в результате деления окна браузера на 3 горизонтальные полосы, средняя из которых делится еще и на 2 колонки. Ширина нижней полосы, как следует из 3-й строки HTML-кода, составляет 50 пикселов, а верхней – составляет восьмую часть от высоты оставшейся области окна браузера. Средняя полоса разделена на узкую полоску слева и вчетверо более широкую оставшуюся часть (см. 5-я строка HTML-кода). Наконец, эта оставшаяся часть поделена пополам по горизонтали (см. 7-ая строка HTML-кода).
