Структура фреймового HTML документа

<HTML>

<HEAD>

ЗАГОЛОВОК ДОКУМЕНТА

</HEAD>

НАБОР ФРЕЙМОВ

</FRAMESET>

АЛЬТЕРНАТИВНОЕ СОДЕРЖАНИЕ

</NOFRAMES>

</HTML>

Как это ни странно, но начнем с конца (чтоб потом не отвлекаться на мелочи) и рассмотрим контейнер <NOFRAMES>...</NOFRAMES>. Данный контейнер содержит альтернативное содержимое документа, отображаемое в окне броузеров не поддерживающих технологию фреймов. Использование данного тега было актуально несколько лет назад, когда фреймы поддерживались только последними версиями MSIE & Navigator, но из вежливости к возможным пользователям продолжайте использовать альтернативный раздел.

Контейнер <NOFRAMES>...</NOFRAMES> может содержать единственную строку с извинениями, может представлять собой полноформатный элемент тела альтернативного документа, заключенный в контейнер <BODY>...</BODY>, но более правильно разместить в нем ссылку на альтернативный документ в котором для представления данных используются стандартные средства (например таблицы).

Теперь рассмотрим контейнер <FRAMESET>...</FRAMESET> который определяет фреймовую структуру документа и содержит элементы фреймы, задаваемые тегом <FRAME>. Тег <FRAMESET>...</FRAMESET> имеет следующие атрибуты:

· ROWS - описание строк фреймовой структуры (проценты высоты окна броузера, пропорции, высота в пикселах);

· COLS - описание столбцов фреймовой структуры (проценты ширины окна броузера, пропорции, ширина в пикселах);

· FRAMEBORDER - описывает сетку фреймовой структуры (по умолчанию значение YES- трехмерная сетка, NO-без сетки);

· BORDER - ширина сетки фреймовой структуры (по умолчанию значение 5);

BORDERCOLOR - цвет сетки фреймовой структуры;

Пример:

<FRAMESET ROWS="15%, 70%, 15%"> </FRAMESET> - создается фреймовая структура (по умолчанию с сеткой шириной 5 пикселей) из трех строк: первая строка 15% высоты окна броузера, вторая 70% и третья 15%;

<FRAMESET COLS="*, 3*" BORDER=3 BORDERCOLOR=GRAY> </FRAMESET> - создается фреймовая структура из двух столбцов: первый ¼ ширины окна броузера, второй ¾ ширины, с сеткой шириной 3 пиксела, цвет сетки - серый;

<FRAMESET ROWS="50%, 50%" COLS="50%, 50%" FRAMEBORDER=NO> </FRAMESET> - создается фреймовая структура без сетки из двух столбцов и двух строк, делящих окно броузера на 4 равные части;

Каждый элемент фреймовой структуры описывается при помощи тега <FRAME>, имеющего следующие атрибуты:

· SRC - URL содержимого фрейма;

· NAME - имя фрейма (аналогия имени окна броузера), для осуществления доступа к фрейму и обновления его содержимого;

· MARGINHEIGHT - ширина верхнего и нижнего свободного поля фрейма в пикселях;

· MARGINWIDTH - ширина левого и правого свободного поля фрейма в пикселях;

· SCROLLING - полосы прокрутки содержимого фрейма (AUTO/YES/NO, по умолчанию значение - AUTO);

· NORESIZE - наличием данного атрибута, пользователю запрещается изменять размеры фрейма при просмотре документа (по умолчанию это возможно при помощи мыши);

· FRAMEBORDER - описывает сетку фрейма (YES/NO);

· BORDERCOLOR - цвет сетки фрейма;

Пример:

</FRAMESET>

Вышеприведенная фреймовая структура делит экран на три продольных части. Верхняя часть занимает 15% высоты окна броузера ее содержимым является документ - header.htm. Средний фрейм занимает 70% высоты окна и в него выводится содержание документа - body.htm. Оставшуюся нижнюю часть окна броузера занимает фрейм, в который выводится содержание документа - footer.htm.

Верхний и нижний фреймы данной структуры не содержат полос прокрутки содержимого и имеют постоянный размер. Атрибут NORESIZE для среднего фрейма не задается, поскольку наложив запрет на изменение размеров прилегающих фреймов мы не сможем изменить размер среднего фрейма.

Возможно использование вложенных фреймовых структур, например следующий код создает фреймовую структуру содержащую вложенный фрейм.

Пример:

</FRAMESET>

</FRAMESET>

Данный пример является развитием вышеприведенной фреймовой структуры. Область окна броузера (70% высоты), отведенная под средний фрейм, содержит вложенную структуру фреймов разделяющих родительский фрейм на два равных столбца. Для наглядности приведем пример таблицы иллюстрирующей данную структуру фреймов:

Header.htm
Left.htm	Right.htm
Footer.htm

Использование фреймов в HTML документах рассмотрим на конкретном примере. Организуем окно броузера следующим образом: в верхней и нижней части разместим стационарные фреймы для заголовка и итоговой части страницы, среднюю часть окна броузера разделим на две части, левую - навигационный фрейм и правую - фрейм просмотра данных. Фрейму просмотра данных, используя атрибут NAME, зададим имя и укажем его как имя окна назначения (См. раздел 2.2.) во всех ссылках навигационного фрейма, используя атрибут TARGET.

Пример 9. Использование фреймов.

Главный документ фреймовой структуры.

<HTML>

<HEAD>

<TITLE>Демонстрация технологии фреймов</TITLE>

</HEAD>

</FRAMESET>

</FRAMESET>

<H1>Обновите броузер и вы увидите фреймы</H1>

</NOFRAMES>

</HTML>

Документ - header.htm

<HTML>

<HEAD>

</HEAD>

<H1 align=center>Ужасы нашего городка</H1>

</BODY>

</HTML>

Документ - footer.htm

<HTML>

<HEAD>

</HEAD>

<P ALIGN=CENTER><A HREF="mailto:myname@mail.ru">Пришлите свою историю</A>

</BODY>

</HTML>

Навигационный фрейм - navig.htm

<HTML>

<HEAD>

</HEAD>

<UL>

</UL>

</BODY>

</HTML>

Фрейм область просмотра данных - empty.htm

<HTML>

<HEAD>

</HEAD>

</BODY>

</HTML>

Документ для просмотра - horror1.htm

<HTML>

<HEAD>

</HEAD>

<H2>Ужасная история №1</H2>

Здесь я вам расскажу очень страшную истории, в которую я попал будучи в командировке, в городе ....

</BODY>

</HTML>

Документ для просмотра - horror2.htm

<HTML>

<HEAD>

</HEAD>

<H2>Ужасная история №2</H2>

Здесь я вам расскажу очень страшную истории, в которую я попал будучи в изрядном подпитии ....

</BODY>

</HTML>

Документ для просмотра - horror3.htm

<HTML>

<HEAD>

</HEAD>

<H2>Ужасная история №3</H2>

Здесь я вам расскажу очень страшную истории, в которую я попал будучи в компании администраторов NT ....

</BODY>

</HTML>

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

<2122 23 24 25 26 27 >

Дата добавления: 2015-04-19; просмотров: 1090;