Разделение окна 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 ROWS=20%,*>
<FRAME SRC="Заголовок.html">
<FRAMESET COLS=30%,*>
<FRAME SRC="Меню.html">
<FRAME SRC="Приветствие.html">
</FRAMESET>
</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, посмотрите, как теперь раскрываются ссылки в кадре Меню, удобно ли после просмотра одной из них переходить к другой.