Абсолютный — в точках, размер таблицы не зависит от размеров окна браузера или настроек экрана. Пример: <TABLE WIDTH=600>

1.            Абсолютный — в точках, размер таблицы не зависит от размеров окна браузера или настроек экрана. Пример: <TABLE WIDTH=600>.

2.            Относительный — в процентах от ширины окна, например: <TABLE WIDTH=80%>.

Кроме ширины всей таблицы можно настраивать ширину отдельных ячеек, используя атрибут WIDTH тегов <TD> и <TH>. Ширина указывается либо в точках, либо в процентах (от ширины таблицы).

В теге <TABLE> можно настроить толщину внутренних линий сетки, используя атрибут CELLSPACING, значением которого является толщина в точках. Кроме того, возможна настройка размера отступов от линий сетки до содержимого ячейки (также в точках), для этого используется атрибут CELLPADDING тега <TABLE>.

Пример таблицы с настройками различных размеров находится в файле Tables\T2.html.

9.3. Настройка цвета фона для таблицы

В HTML имеется возможность использовать в качестве цвета фона для ячеек таблицы цвет, отличающийся от фонового цвета всего документа. Для этого используется атрибут BGCOLOR, который можно использовать в теге <TABLE> (фон для всей таблицы), <TR> (для одной строки), <TD> и <TH> (для отдельной ячейки). Значение цвета задаётся в уже известном нам виде: указывается либо одно из стандартных названий, либо интенсивности трёх составляющих цвета в виде #RRGGBB. Пример таблицы с настройками цветов фона имеется в файле Tables\T3.html.

9.4. Настройка вида содержимого ячеек таблицы

В примерах T1.html — T3.html текст внутри ячеек всегда выровнен по левому краю. Изменить горизонтальное выравнивание можно при помощи атрибута ALIGN в тегах <TR>, <TH> и <TD> (для строки или отдельной ячейки, соответственно). Значениями этого атрибута могут быть LEFT, RIGHT и CENTER.

Кроме горизонтального выравнивания можно указать вертикальное выравнивание содержимого отдельных ячеек. Для этого в теге <TD> или <TH> указывается атрибут VALIGN, значениями которого могут являться TOP, MIDDLE и BOTTOM.

Пример использования атрибутов ALIGN и VALIGN можно найти в файле Tables\T4.html.

При помещении текста в ячейки таблицы происходит автоматический переход на новую строку. Если текст в какой-либо ячейке разрывать нельзя, то в соответствующем теге <TH> или <TD> следует указывать атрибут NOWRAP (не требует значения). Очевидно, что засчет этого возможно увеличение ширины соответствующего столбца.

9.5. Слияние нескольких ячеек

Иногда соседние ячейки таблицы содержат одинаковые данные, в этом случае имеет смысл объединить их. Для того чтобы слить несколько соседних ячеек строки в одну, используют атрибут COLSPAN тега <TD> (или <TH>), значением которого является число ячеек, подлежащих слиянию. После такого контейнера пропускают несколько контейнеров <TD> (или <TH>), поскольку данные объединённой ячейки уже записаны. В файле Tables\T5.html приведён пример слияния двух ячеек с фамилией и именем в одну.

Аналогичным образом можно объединить смежные ячейки в одном столбце. Для этого в теге <TD> (или <TH>), соответствующем самой верхней из объединяемых ячеек, записывается атрибут ROWSPAN, значением которого является количество объединяемых ячеек. В последующих строках теги <TD> (или <TH>), соответствующие объединённой ячейке, не пишутся. Пример такого объединения ячеек приведён в файле Tables\T6.html.

При необходимости можно объединить прямоугольную область, состоящую из ячеек нескольких соседних строк и столбцов. Для этого потребуется одновременно использовать атрибуты COLSPAN и ROWSPAN в одном теге <TD> (или <TH>). Пример находится в Tables\T7.html.

10. Фреймы 10.1. Основные сведения

В этой части мы рассмотрим такую возможность языка HTML, как разбиение окна браузера на несколько частей, в которых отображаются разные HTML-документы.

Окно браузера всегда разбиваются на прямоугольные кадры (традиионно, они называются по-английски, фреймами). Внешне разбиение напоминает таблицу: кадры выстраиваются в несколько «строк», каждая из которых содержит несколько прямоугольных ячеек, содержащих отдельные HTML-документы. Пример, который содержит 6 различных фреймов, можно увидеть в Frames\F1.html.

Для того чтобы разбить документ на несколько прямоугольников, вместо контейнера BODY нам потребуется записать контейнер FRAMESET (набор фреймов). В теге <FRAMESET> нужно указать на сколько «строк» и «столбцов» разбивается всё окно браузера. Это делается с помощью атрибутов ROWS (строки) и COLS (столбцы). Заметим, что в этих атрибутах недостаточно указать количество строк и столбцов, требуются также их размеры, например в процентах от размеров окна. В примере Frames\F1.html это сделано так: <FRAMESET ROWS="50%,50%" COLS="33%,33%,34%"> (всё окно разбивается на две одинаковые “строки” и на три почти одинаковых столбца).

Внутри контейнера FRAMESET перечисляются HTML-документы, которые нужно поместить в кадры (слева направо, сверху вниз). Это делается с помощью последовательных тегов <FRAME>. Самый важный атрибут тега <FRAME> — это SRC, значением которого является URL документа, помещаемого в этот фрейм, например: <FRAME SRC=”1.html”>.

Размеры фреймов в теге <FRAMESET> можно указывать не только в процентах. Можно также указать из в частях, например <FRAMESET ROWS="*, 2*" COLS="2*, *, 3*"> (по высоте окно условно разбито на 3 части, первая “строка” кадров занимает две из них, вторая — одну, по ширине имеется 6 условных частей, “столбцы” занимают, соответственно, 2, 1 и 3 части).

Другой вариант — указание размеров в точках, например: COLS=”300,100,400”. Возможно и смешанное указание размеров (точки — проценты, точки — части, части — проценты). Можно, например, записать: COLS=”200,30%,70%”, что означает: первый «столбец» всегда имеет ширину 200 точек, независимо от размеров окна, второй занимает 30% от оставшейся части ширины окна, а третий — 70% от этого остатка. Примеры документов, использующих различные способы указания размеров, находятся в файлах Frames\F2.html и Frames\F3.html.

10.2. Управление внешним видом фреймов

Внешний вид фреймов настраивается с помощью атрибутов тегов <FRAME> и <FRAMESET>. Ниже перечисляются эти атрибуты и объясняется их назначение:

1.    BORDERCOLOR (для <FRAME> и <FRAMESET>). Управляет цветом границы одного фрейма или всего набора фреймов. Значением является либо название стандартного цвета, либо числовой код (#RRGGBB).

2.    BORDER (для <FRAMESET>). Задаёт ширину всех границ, отделяющих фреймы друг от друга. Значение нужно указывать в точках.

3.    NORESIZE (для <FRAME>). Этот атрибут не требует значения. Если он присутствует, то пользователь не может перемещать мышью границу соответствующего фрейма.

4.    MARGINHEIGHT и MARGINWIDTH (для <FRAME>). Позволяют указать (в точках) размеры отступов от горизонтальной (и вертикальной) границы фрейма до содержимого HTML-документа, лежащего внутри этого фрейма.

5.    SCROLLING (для <FRAME>). Когда документ HTML не помещается целиком в отведённый ему фрейм, для возможности просмотра появляются полосы прокрутки фрейма. В атрибуте SCROLLING можно указать, показывать ли полосы прокрутки всегда (значение YES), только когда документ не помещается во фрейм (AUTO), или не показывать никогда (NO).

Примеры использования этих атрибутов есть в файлах Frames\F4.html, Frames\F5.html и Frames\F6.html.

10.3. Вложенные фреймы

При желании можно добиться того, чтобы какой-либо фрейм вместо обычного HTML-документа содержал бы, в свою очередь, набор фреймов. Для этого достаточно вместо тега <FRAME> поместить контейнер <FRAMESET>, в который вложены теги <FRAME>. Пример такой раскладки фреймов можно увидеть в файле Frames\F7.html.

10.3. Гиперссылки и фреймы

HTML позволяет управлять работой гиперссылок так, чтобы документ, на который указывает ссылка открывался не в целом окне, а только в одном фрейме (см. пример Frames\F8.html).

Для того чтобы ссылки работали именно так, нужно выполнить два действия:

1.    Фрейму, в который в дальнейшем нужно помещать документ, найденный по ссылке, дают имя. Для этого используют атрибут NAME тега <FRAME>, например: <FRAME NAME=”right”>.

2.    При вставке ссылки в HTML-документ другого фрейма в теге <A> указывают атрибут TARGET (цель), значением его является имя фрейма, в который нужно поместить HTML-документ, указанный в HREF, например: <A HREF=”1.html” TARGET=”right”> 1.html </a>.

Кроме имён, которые можно давать собственным фреймам, существуют и стандартные имена, заранее известные браузеру, а именно:

«_self» — позволяет открывать документ по ссылке в том же фрейме, где находилась ссылка

«_top» — открывает документ во всё окно, где находилась ссылка, разрушая при этом всю структуру фреймов

«_parent» — в родительском фрейме; это не совсем то же самое, что _top, поскольку фреймы бывают вложенными; вся структура родительского фрейма разрушается

«_blank» — в новом окне браузера; старое окно (содержащее ссылку) при этом не уничтожается.