Лабораторная работа № 5
Тема: Создание документа с фреймами.
Цель: научиться создавать веб-документы с фреймовой
структурой.
Оборудование и программное обеспечение:
· Персональный компьютер IBM PC/AT.
· Операционная система Windows
95/98/NT/2000/2003/XP.
Практическая часть.
1. Изучили теоретическую часть:
ü
Параметры тега <FRAMESET>.
ü
Параметры тега <FRAME>.
ü
Тег <NOFRAMES>.
ü Плавающие фреймы.
2.
2.1 - Создали документ, содержащий 2 фрейма,
расположенных вертикально. Левый фрейм (узкий) предназначен для вывода меню,
правый (широкий) — для вывода содержимого документов, на которые мы ссылаетесь
из меню. Размеры фреймов изменяемы.
2.2 - Создали в левом фрейме меню для навигации по
страницам, разработанными нами на предыдущих занятиях. Проверили работу
документа с фреймами.
<HTML>
<HEAD>
<TITLE>Лабараторная
работа №5</TITLE>
</HEAD>
<FRAMESET
cols="30%,70%" frameborder="0" border="0">
<FRAME
name="1" src="g.html" scrolling="yes"
marginwidth="10" marginheigth="5">
<FRAMESET
frameborfer="0" border="0">
<FRAME
name="2">
</FRAMESET>
</HTML>
g.html
<HTML>
<HEAD>
<TITLE>Содержание
лабораторный работ</TITLE>
</HEAD>
<BODY>
<h2
align="center">Содержание:</h2>
<br>
<ol>
<a href="1\web11.html"
target="2"><li>Лабараторная работа
№1</li></a>
<a
href="2.html" target="2"><li>Лабараторная работа
№2</li></a>
<a
href="1\chart.html" target="2"><li>Лабараторная работа
№3</li></a>
<a href="1\описание.html"
target="2"><li>Лабараторная работа
№4</li></a>
</ol></br>
</BODY>
</html>
3.
3.1 -
Создали веб-страницу,
содержащую маркированный список дней недели и «плавающий» фрейм. Фрейм
располагается справа от списка, высота фрейма – 30% от высоты окна браузера. В
качестве фона страницы использовали графическое изображение.
3.2 -
Добавили в
веб-документ заголовок «Расписание занятий».
3.3 -
Для отдельных дней
недели создали html-файлы, которые содержат информацию о дне недели и
расписании занятий на этот день. Название дня недели сделали жирным курсивом по
центру, а занятия перечислили нумерованным списком.
3.4 -
Создали гиперссылки,
позволяющие перейти от дня недели из списка к расписанию занятий на этот день.
Расписание отображается во фрейме.
<HTML>
<HEAD>
<TITLE>Лабараторная
работа №5</TITLE>
<HEAD>
<body
BACKGROUND="1\img\графика.jpg">
<h2>Расписание занятий</h2>
<iframe
name="1" align="right"
height="30%"></iframe>
<ul>
<li><a
href="(1).html" target="1">Понедельник</a>
<li
TYPE=circle><a href="(2).html" target="1">Вторник</a>
<li><a
href="(3).html" target="1">Среда</a>
<li
TYPE=circle><a href="(4).html" target="1">Четверг</a>
<li><a
href="(5).html" target="1">Пятница</a>
<li
TYPE=circle><a href="(6).html" target="1">Субота</a>
</ul>
</body>
</HTML>
4.
4.1 -
Создали документ с
фреймовой структурой, приведенный в методическом пособии. Содержание и
оформление страницы выбирали самостоятельно.
4.2 -
Организовали гиперссылки к
3 страницам нашего сайта
<HTML>
<HEAD>
<TITLE>Лабораторная работа
№5</TITLE>
</HEAD>
<FRAMESET
rows="20%,*,10%" FRAMEBORDER="1" BORDER="4">
<FRAMESET
cols="20%, 60%" FRAMEBORDER="1" BORDER="4">
<FRAME
SRC="1\img\2.gif" MARGINHEIGHT="15"
MARGINWIDTH="75"
NORESIZE
SCROLLING="no">
<FRAME
SRC="f1.html" SCROLLING="no"
MARGINHEIGHT="35">
</FRAMESET>
<FRAMESET
cols="20%,60%" FRAMEBORDER="1" BORDER="4">
<FRAME
SRC="f2.html" NORESIZE SCROLLING="no">
<FRAME
name="1" SRC="f3.html" SCROLLING="no">
</FRAMESET>
<FRAME
SRC="f4.html" SCROLLING="no" FRAMEBORDER="1"
BORDER="4">
</FRAMESET>
</HTML>
5.
Ответили на контрольные
вопросы.
6.
Оформили отчёт по
выполненному заданию.
Вопросы для контроля:
1.
Какие теги используются
для создания фреймов?
2.
Как организуется
взаимосвязь между фреймами?
3.
Можно ли задать фоновое
изображение и цвет фона для всей страницы с фреймами?
4.
Как задается количество
фреймов на странице?
5.
Для чего используется тег <IFRAME>?
Ответы на вопросы для контроля:
1.
<FRAMESET>;
<FRAME> (заключенных внутри тега фреймовой структуры <frameset>).
2.
С помощью параметра:
-
NAME. Данный параметр присваивает текущему фрейму внутреннее имя, которое
используется для взаимодействия между различными фреймами
3.
Можно с помощью параметра
к тегу <Body> background.
4.
С помощью параметров тега <Frameset>: Colsи Rows.
5.
Создаёт плавающий фрейм,
который находится внутри обычного документа, он позволяет загружать в область
заданных размеров любые другие независимые документы