logo
УМП по КИТСоздание Web-документов с помощью HTM

7.2. Создание фреймов

Для создания Web-страницы, разделённой на фреймы, нужно воспользоваться тегами <FRAMESET> и <FRAME>.

С помощью парного тега <FRAMESET> … </FRAMESET> форми-руется набор фреймов, которые делят страницу на строки и столбцы, а также задаются различные настройки их отображения в окне браузера. Для этих целей используются различные атрибуты данного тега.

Тег <FRAMESET> обязательно должен содержать атрибуты COLS (набор вертикальных рамок) или (и) ROWS (набор горизонтальных рамок), определяющие способ разбиения документа. В случае использования атрибута COLS страница разбивается на вертикальные области (фреймы), а в случае использования ROWS – на горизонтальные. Если заданы оба атрибута, то создается сетка фреймов. Значения этих атрибутов – это перечисленные через запятую размеры отдельных фреймов. Значения атрибутов COLS и ROWS могут быть заданы в пикселях или в процентах от общей площади окна. Например:

<FRAMESET COLS="60%, 40%">,

где первая вертикальная рамка составляет 60%, а вторая – 40% от общей площади окна.

Послед­няя область может быть указана с помощью символа «*», определяющего, что ей выделяется все оставшееся пространство. Запись тега

<FRAMESET ROWS="40%, 40%,*">

означает, что создаются три горизонтальных фрейма, два из которых занимают по 40% общей площади окна, а третий – 20%.

Атрибут BORDER тега <FRAMESET> даёт возможность изменять толщину линий, обрамляющих фрейм. По умолчанию браузер заключает фрейм в рамку, равную 6 пикселям.

Установки атрибутов COLS и ROWS сами по себе не создают рамки. Для создания индивидуальной рамки используется одинарный тег <FRAME>, который записывается внутри парного тега <FRAMESET> … </FRAMESET>. Количество тегов <FRAME> должно соответствовать числу рамок, заданному с помощью атрибутов COLS и ROWS.

Тег <FRAME>, в свою очередь, должен содержать обязательный атрибут SRC, с помощью которого указывается, какой документ перво-начально загружается в соответствующую область. Значение этого атри-бута – это адрес нужного документа.

Среди прочих атрибутов следует отметить атрибут NAME, с по-мощью которого можно задать «имя» созданной области. Для загрузки в рамку с именем Фокус текста из файла text.htm следует записать следующий тег:

<FRAME SRC="text.htm" NAME="Фокус">.

Имя созданной области можно использовать для загрузки новых документов в эту область. Для этого в тег <А>, определяющий гипер-ссылку, необходимо добавить атрибут TARGET (цель), значение которого совпадает с ранее определенным именем области. При переходе по данной гиперссылке новый документ загрузится в указанный фрейм.

Пусть начальная страница Web-сайта состоит из двух фреймов: слева располагается навигационная панель, а справа – текущая страница. Если правой области присвоено имя, используемое во всех ссылках, имеющихся в левой области, то щелчок по любой ссылке навигационной панели приведет к обновлению информации в соседней области, оставляя нави-гационную панель без изменений.

Пользователь может перемещать границы фрейма, задавая новые размеры областей, чтобы лучше рассмотреть определенный фрагмент данных. Для запрещения изменения границ фрейма применяется атрибут NORESIZE. Если фреймы лишены видимых границ, это автоматически влечет запрет и на изменение их размеров. Для скрытия границ фрейма служит атрибут FRAMEBORDER. Цвет границ можно изменить при помощи атрибута BORDERCOLOR.

По умолчанию браузер отображает фреймы с полосой чистого пространства (полями) между текстом и границей фрейма, равной 10 пикселям. Атрибут MARGINWIDTH позволяет задавать ширину левого и правого полей, а атрибут MARGINHEIGHT – высоту верхнего и нижнего полей. Задавая величины полей, надо использовать оба атрибута, так как браузер может автоматически сократить размеры тех полей, которые не были указаны, до наименьшего значения. Пример Web-страницы, создан-ной с использованием фреймов, можно увидеть на рис. 7.1.

Рис. 7.1. Пример Web-страницы с использованием фреймов

HTML-код страницы, представленной на рис. 7.1, имеет вид:

<HTML>

<HEAD>

<TITLE>Фреймы</TITLE>

</HEAD>

<FRAMESET FRAMEBORDER="YES" ROWS="50,*">

<FRAME SCROLLING="YES" NORESIZE

SRC="Страница 1.htm" NAME="1">

<FRAMESET COLS="150,*">

<FRAME SCROLLING="YES" NORESIZE

SRC="Страница 2.htm" NAME="2">

<FRAME SCROLLING="YES" NORESIZE

SRC="Страница 3.htm" NAME="3">

</FRAMESET>

</FRAMESET>

</HTML>

В приведенном примере страница сначала разбивается на две горизонтальные рамки. Верхняя рамка задаётся с помощью тега <FRAME> с параметрами. Нижняя рамка задаётся парным тегом <FRAMESET> … </FRAMESET> и дополнительно делится на две вертикальные (атрибут COLS="150,*"). Таким образом создаётся структура Web-страницы, представленная на рис. 7.1.

Для создания плавающих фреймов служит тег <IFRAME>. В целом плавающий тег работает так же, как и обычный, с той лишь разницей, что здесь обязателен закрывающий тег и что с помощью атрибутов WIDTH и HEIGHT можно задавать размеры плавающего фрейма, так как пользо-ватель самостоятельно изменить их не может.