|
Фреймы позволяют отображать несколько взаимосвязаных докуметнов в одном окне браузера. При работе с фреймами в окно браузера загружается документ с описанием набора фреймов, который в свою очередь осуществляет загрузку документов в каждый из фреймов. На рисунке 1.1 показано взаимоотношение между HTML-документом, содержащим набор фреймов и документами, загружаемыми в фреймы.
Рисунок 1.1
Для работы с набором фреймов, изображенном на рисунке необходимо создать четыре HTML-документа. Начнем с документа с описанием набора фреймов используется тэг <FRAMESET>. В HTML-документе, тег <FRAMESET> заменяет тег <BODY>, как показано ниже:
1 <HTML>
2 <HEAD>
3 <TITLE> Заголовок документа </TITLE>
4 <META HTTP-EQUIV="Content-Type"
5 CONTENT="text/html; CHARTER=windows-1251">
6 </HEAD>
7 <FRAMESET>
8 <!-- Здесь располагается описание фреймов -->
9 </FRAMESET>
10 <NOFRAMES>
11 <!--Здесь располагается описание Web-страницы для браузеров, которые не могут
отображать фреймы -->
12 </NOFRAMES>
10 </HTML>
Сущестенно, что если вы включаете тег <FRAMESET> в HTML-документ, то не можете одновременно включать тег <BODY>. Эти теги взаимно исключающие. Кроме того, в определении набора фреймов не должно быть тегов, не относящихся к описанию фреймов, за исключением одного особенного случая — тега <NOFRAMES>, который служит для описания содержимого Web-страницы ,отображаемой в браузерах, не поддерживающих работу с фреймами (если таковые еще имеются). Тег <FRAMESET> содержит только описания для фреймов и поддерживает обработку двух событий:
- ONLOAD — загрузки описания набора фреймов в браузер;
- ONUNLOAD — выгрузка документа с описанием фреймов из браузера;
Кроме того, тег <FRAMESET> поддерживает два атрибута: COLS и ROWS, один из которых обязательно нужно включить в определение набора фреймов. Формат определения набора фреймов имеет вид:
<FRAMESET COLS="ширина фрейма, ширина фрейма, ...">
или
<FRAMESET ROWS="высота фрейма, высота фрейма, ...">
Атрибут COLS предписывает браузеру разбить экран на несколько вертикальных фреймов, ширина которых определяется аргументами COLS. Каждый аргумент отделяется л\друг от друга запятой. Вы можете определить ширину каждого фрейма либо непосредственно в пикселах , либо в процентах от ширины окна, либо с помощью звездочки (*). При использовании звездочки, браузер отводит данному фрейму максимально возможную ширину.
Следующее определение набора фреймов
<FRAMESET COLS="100,50%,*">
создает три вертикальных фрейма, самый левый из которых имеет ширину 100 пикселей, второй — 50% от ширины окна браузера, а третий занимает оставшееся пространство. На рисунке 1.2 представлен данный набор фреймов, исходный текст примера находится в файле example1.txt.
Рисунок 1.2
 |
|
Так как чаще всего необходимо создавать страницы, которые корректно отображаются при различных размерах окна браузера, то по возможности не следует указывать размер фреймов в пикселах. Если же все-таки приходится задавать размеры фреймов в пикселах, то, по крайней мере, один параметр нужно задать с попощью звездочки, чтобы полностью использовать окно браузера.
|
|
| | |
|
|
Для создания набора трех одинаковых вертикальных фреймов лучше всего записать COLS="*,*,*". В этом случае вам не придется задумываться о процентах, так как браузер автоматически задаст одинаковую ширину для каждого фрейма.
| |
|
Атрибут ROWS выполняет те же функции, что и атрибут COLS за исключением того, что он создает горизонтальные фреймы. Например, для разделения экрана на два фрейма равной высоты, как показано на рисунке 1.3 (файл example2.txt) нужно записать следующее:
<FRAMESET ROWS="50%,50%">
Того же эффекта можно добиться и другим способом:
<FRAMESET ROWS="*,*">
Рисунок 1.3
Если вы попытаетесь самостоятельно воспроизвести последние два примера, закодировав теги <FRAMESET>...</FRAMESET>, то обнаружите, что фреймы не отображаются. Такой результат связан с тем, что не определено содержимое для фреймов набора. Чтобы определить его, нужно использовать тег <FRAME>, имеющий следующий формат:
<FRAME SRC="Указатель ресурса для документа">
В теге <FRAME> можно указать дополнительные атрибуты, перечисленные в таблице.
| Атрибут |
Значение |
Описание |
| SCROLLING |
AUTO (задается по умолчанию) |
Если содержимое фреейма занимает больше места, чем ему отведено, то браузер автоматически добавляет вертикальную и горизонтальную полосы прокрутки, чтобы пользователь мог посмотреть оставшуюся часть документа в фрейме. |
| SCROLLING |
NO |
В данном случае полосы прокрутки не будут появлятся ни при каких условиях. |
| SCROLLING |
YES |
Полосы прокрутки будут выводится всегда вне зависимости от потребности в них. |
| NORESIZE |
|
По умолчанию, пользователь может менять положение границ фреймов, перетаскивая их с помощью мыши. Для блокировки изменения размеров фрейма и используется этот атрибут. |
| FRAMEBORDER |
0 или 1 |
При задании значения атрибута, равного 0, границы фрейма не отображаются. Значение по умолчанию равно 1. |
| MARGINHEIGHT |
Значение в пикселах |
Этот атрибут позволяет указать размер верхнего и нижнего полей фрейма. |
| MARGINWIDTH |
Значение в пикселах |
Этот атрибут позволяет указать размер левого и правого полей фрейма. |
| NAME |
Строка |
Имя фрейма, используется в атрибуте TARGET тега <A> для загрузки документа в фрейм. |
Вы уже, наверное, заметили, что все фреймы на рисунках имеют достаточно толстые границы, которые отделяют их друг от друга, однако с помощю атрибута FRAMEBORDER можно включить и выключить отображение границ. Этот атрибут может принимать значения 0 или 1, значению 1 соответствует отображение границ. Он может использоватся и в теге <FRAMESET>, задавая отображение границ для всех фреймов в наборе.
Еще один атрибут тега <FRAMESET> позволяет управлять шириной границ. Атрибут BORDER задает толщину всех границ набора фрейма в пикселах. Указывать атрибут BORDER можно только в самом внешнем теге <FRAMESET> для семейства вложеных друг в друга наборов фреймов. Все остальные значение этого атрибута игнорируются.
Вернемся к рисунку 1.1. Каким образом можно создать такую структуру фреймов? На рисунке 1.1 верхняя часть окна браузера содержит два вертикальных фрейма, а нижний фрейм занимает всю ширину окна. Для создания документа, определяющего набор фреймов с такой структурой, необходимо создать следующий HTML-файл:
<HTML>
<HEAD>
<TITLE>Два вертикальных фрейма для сложной структуры (20.html)</TITLE>
<META HTTP-EQUIV="Content-Type"
CONTENT="text/html; CHARTER=windows-1251">
</HEAD>
<FRAMESET ROWS="80%,*">
<FRAME SRC="21.html">
<FRAME SRC="22.html" NAME="3">
</FRAMESET>
</HTML>
Данный HTML-дркумент описывает набор фреймов, расположеных горизонтально, причем высота верхнего фрейма занимает 80% высоты окна. В верхней фрейм загружается документ 21.html, который сам является набором фреймрв.
<HTML>
<HEAD>
<TITLE>Два горизонтальных фрейма для сложной структуры (21.html)</TITLE>
<META HTTP-EQUIV="Content-Type"
CONTENT="text/html; CHARTER=windows-1251">
</HEAD>
<FRAMESET COLS="30%,*">
<FRAME SRC="23.html" NAME="1">
<FRAME SRC="24.html" NAME="2">
</FRAMESET>
</HTML>
Этот документ описывает два вертикальных фрейма в верхней части окна. В левом фрейме отображается документ 23.html , в правом — 24.html, а в нижнем — 22.html.
Эти документы однотипны, поэтому приведем только один из них.
<HTML>
<HEAD>
<TITLE>Левый документ для сложной фреймовой структуры (23.html)</TITLE>
<META HTTP-EQUIV="Content-Type"
CONTENT="text/html; CHARTER=windows-1251">
</HEAD>
<BODY BGCOLOR="#FFFFFF">
<TABLE BORDER=0 WIDTH="100%" HEIGHT="100%">
<TR><TD></TD><TD></TD></TR>
<TR><TD></TD>
<TD ALIGN="CENTER" VALIGN="MIDDLE" WIDTH="30%" HEIGHT="30%">
<FONT SIZE=7><B>1</B></FONT>
</TD><TD></TD>
</TR>
<TR><TD></TD><TD></TD></TR>
</TABLE>
</BODY>
</HTML>
Составной набор фреймов (документ 20.html) приведен на рисунку 1.4.
Рисунок 1.4
|
|
Не рекомендуется создавать наборы с числом фреймов, превышающим 3-4, из-за замедления загрузки документов и перерысовки фреймов.
|
|
Решим теперь вопрос о том, как работать с гиперссылками в HTML-страницах с фреймами. Если, например, в левом фрейме создать гиперссылку:
<A HREF="23.html">Документ 23.html </A>
то документ 23.html будет загружен в том же фрейм. Для загрузки документа в правый фрейм в теге <A> необходимо указать атрибут TARGET="2", где "2" — имя фрейма, заданое в атрибуте NAME тега <FRAME>.
Использование имен фреймов и атрибута TARGET позволяет, например, строить наборы фреймов, когда оглавление электронного издания располагается в одном фрейме, а сами документы отображаются в другом.
Наконец, для замены набора фреймов другим документом в окне браузера необходимо в качестве значения атрибута TARGET указать специальное имя _top. Продолжая рассмотренный выше пример, щелчек мышью на гиперссылке
<A HREF="23.html" TARGET="_top">Документ 23.html </A>
приведет к отображению в центре окна цифры 1.
by ktima
|
