Разделение окна Explorer на фреймы

Лабораторная работа №6.

Задание

Составить HTML-документ, разделяющий и заполняющий экран по следующей схеме:

Заголовок.html
Меню.html	Приветствие.html

В документ Меню внести гиперссылки на документы Пункт1.html, Пункт2.html, Пункт3.html, которые будут раскрываться в правом нижнем фрейме вместо файла Приветствие.html

Выполнение

I. В папке Сайт подготовьте бланки для шести HTML-документов. Для этого следует:

1) выполнить команду Пуск ® Программы ® Стандартные ® Блокнот ® Файл® Сохранить как…;

2) в окне Сохранение документа открыть папку своей группы, затем папку Сайт. В поле Имя ввести Заголовок.html, нажать кнопку Сохранить. Если все сделано правильно, то в папке Сайт появится этот файл со значком обозревателя, в противном случае – со значком блокнота. Тогда следует удалить созданный файл и повторить все снова;

3) ввести в созданный документ следующее содержание и сохранить его:

<HTML>

<HEAD>

<TITLE> Заголовок … (Ваша фамилия) </TITLE>

</HEAD>

<BODY>

Заголовок сайта

</BODY>

</HTML>

Для ускорения и облегчения набора желательно активно пользоваться командами копирования и переноса информации;

4) сделать пять копий файла Заголовок.html, назвать их соответственно Меню.html, Приветствие.html, Пункт1.html, Пункт2.html, Пункт3.html;

5) заменить в этих файлах в тегах <TITLE> и <BODY> слово Заголовок на слово, соответствующее названию файла;

6) просмотреть через Explorer, правильно ли созданы файлы, и если да, то закрыть все окна с ними. В результате на панели задач должна остаться только кнопка папки Сайт.

II. Создайте в папке Сайт и просмотрите в Explorer новый документ, назвав его Index.html:

<HTML>

<HEAD>

<TITLE> Начальный документ сайта… (Ваша фамилия) </TITLE>

</HEAD>

</FRAMESET>

</HTML>

Внешний контейнер <FRAMESET> делит окно броузера на две строки, внутренний делит вторую строку на два столбца. Теги <FRAME SRC="…"> указывают, какие файлы следует раскрывать в получившихся фреймах (кадрах).

Вывод. Окно броузера разделено на кадры в соответствии с предложенной в задании схемой.

III. Измените содержание документа Меню.html. Для этого следует сделать щелчок правой кнопкой мыши в кадре с Меню.html и в появившемся меню заказать команду Показать код HTML, затем в контейнер <BODY> вместо первоначального текста ввести список гиперссылок на файлы Пункт1.html, Пункт2.html, Пункт3.html (лабораторную работу № 5 – файл Резюме…). Самый простой вариант кода:

<UL>

<LI><A HREF="Пункт1.html"> Ссылка на п. 1 </A>

<LI><A HREF="Пункт2.html"> Ссылка на п. 2 </A>

<LI><A HREF="Пункт3.html"> Ссылка на п. 3 </A>

</UL>

Сохраните изменения в Меню.html. Обновите в окне Explorer документ Index.html.

Посмотрите, как раскрываются ссылки и удобно ли после просмотра одной из них переходить к другой.

IV. Введите имя для кадра, в котором Вы хотите раскрывать ссылки. Для этого следует открыть код документа Index.html (если Блокнот с кодом Index.html закрыт, можно быстро открыть его командой меню Вид ® Показать код HTML). В тег <FRAME SRC="Приветствие.html"> добавьте атрибут NAME="Просмотр". Сохраните изменения.

V. Нацельте гиперссылки из документа Меню.html на вывод их информации в кадре Просмотр. Для этого следует открыть код документа Меню.html (см. п. III). В каждый тег гиперссылок добавить атрибут TARGET="Просмотр". Сохранить изменения.

VI. В окне Explorer обновите документ Index.html, посмотрите, как теперь раскрываются ссылки в кадре Меню, удобно ли после просмотра одной из них переходить к другой.