1к2с Информационные технологии - КР / МУ к практической работе Работа с фреймами в HTML
.pdf1
Министерство образования и науки Российской Федерации
Саратовский государственный технический университет
Балаковский институт техники, технологии и управления
РАБОТА С ФРЕЙМАМИ В HTML
Методические указания к выполнению практических работ по дисциплине «Информационные технологии»
для направления «Информационные системы и технологии» всех форм обучения
Одобрено редакционно-издательским советом Балаковского института техники,
технологии и управления
БАЛАКОВО
2
ЦЕЛЬ РАБОТЫ: изучить добавление элементов управления на веб-страницу и создавать форму в HTML.
ОБЩИЕ ПОНЯТИЯ
Фреймы - это окна независимого просмотра HTML-документов. Очень удобно организовать навигацию по странице в виде меню, оформленного в отдельном фрейме, и основного окна, где будет представлена вся основная информация,
определяемая действиями пользователя в области меню.
Рассмотрим следующий пример HTML-страницы, использующей фреймы:
<HTML>
<HEAD>
<TITLE>Страница с двумя вертикальными фреймами</TITLE>
</HEAD>
<FRAMESET cols="30%,70%" frameborder="yes" framespacing="1"> <FRAME name="MenuFrame" src="MainMenu.html">
<FRAME name="MainFrame" src="Text1.html"> </FRAMESET>
</HTML>
Здесь присутствует объявление двух фреймов, которые будут располагаться вертикальными полосами и занимать соответственно 30 и 70 процентов рабочей области. Тег <FRAMESET> имеет следующие атрибуты:
cols="..." - задает вертикальное расположение полос фреймов
rows="..." - задает горизонтальное расположение полос фреймов
bordercolor="..." - задает цвет рамки, которая разделяет отдельные фреймы;
frameborder="..." - указывает браузеру, отображать ли рамку у фреймов или нет;
border="..." — определяет ширину рамки между фреймами.
framespacing="..." - определяет расстояние между фреймами.
Определение документа, изначально загружаемого при открытии этого файла,
задается атрибутом тега <FRAME> src="...", при этом необходимо указать параметр
name= "...". Сам же документ является обыкновенной HTML-страницей.
3
Как видно из листинга, сама страница не содержит какого-либо текста, который присутствует в обычной Web-странице. В данном документе находятся только ссылки на другие HTML-документы, которые будут загружены браузером при открытии страницы с фреймами.
Для того, чтобы ссылки из первого фрейма открывались во втором фрейме
необходимо использовать тег <BASE TARGET>, указывающий в каком окне необходимо открыть документы, ссылки на которые используются в данном документе. Рассмотрим пример:
<HEAD>
<BASE TARGET=MainFrame>
<TITLE></TITLE>
</HEAD>
<BODY>
<CENTER><H3>Первый Frame</H3></CENTER> <P>
<A href="Text1.html"> Первая страничка второго фрейма </A> <P>
<A href="Text2.html"> Вторая страничка второго фрейма </A> </BODY>
</HTML>
Теги <FRAMESET> и <BODY> являются взаимоисключающими. Это означает, что если в документе присутствуют оба указанных тега, то браузер игнорирует тег <FRAMESET> и отображает информацию, заключенную в тег
<BODY>.
ТЕХНОЛОГИЯ ВЫПОЛНЕНИЯ РАБОТЫ
Задание 1. Набрать HTML-код, предварительно создав две веб-страницы
история.htm и математика.htm.
<html>
<head>
<title>Фреймы</title>
</head>
4
<frameset cols="50%, *"> <frame src="история.htm"> <frame src="математика.htm"> </frameset>
</html>
Задание 2. Набрать следующий HTML-код
<html>
<head>
<title>Отображение полосы прокрутки</title> </head>
<frameset cols="50%, *">
<frame src="история.htm" scrolling=no> <frame src="математика.htm" scrolling=yes>
</frameset>
</html>
Задание 3. Набрать следующий HTML-код. Изучить логический атрибут
NORESIZE, который используется для предотвращения возможности изменения пользователем размера фрейма.
<html>
<head>
<title>Логический атрибут NORESIZE </title> </head>
<frameset cols="20%, 80%">
<frameset rows=”100, 200”>
<frame src="история.htm" noresize > <frame src="математика.htm">
</frameset>
</html>
Задание 4. Набрать следующий HTML-код, который показывает как создать страницу, содержащую три фрейма в виде колонок. Второй фрейм имеет фиксированный размер в 250 пикселов, первый занимает 25%, а третий 75%
оставшегося пространства.
5
<html>
<head>
<title>Три вертикальных фрейма </title> </head>
<frameset cols="1*,250, 3*">
<frame src="история.htm" frameborder=0>
<frame src="математика.htm" frameborder=0 marginwidth=25>
<frame src=”flowers.jpg”>
</frameset>
</html>
Задание 5. Набрать следующий HTML-код. <html>
<head> <title>Фреймы </title> </head>
<frameset cols="33%,33%, 34%">
<frame src="flowers.jpg" frameborder=0> <frameset rows="40%,50%>
<frame src="математика.htm">
<frame src=”история.jpg”>
</frameset>
<frame src=” flowers.jpg”>
</frameset>
</html>
ТРЕБОВАНИЯ БЕЗОПАСНОСТИ ТРУДА
При выполнении лабораторной работы необходимо выполнять общие правила техники безопасности:
используйте ПК только в соответствии с их назначением;
не разрешается класть на корпус ПК и под него посторонние предметы (карандаши, тетради, книги и т.п.);
6
оберегайте ПК от толчков, ударов, сотрясений;
подключение и отсоединение периферийных устройств производится только персоналом ИВЦ;
при обнаружении задымления, загорания, пожара немедленно поставить в известность оператора;
обо всех неисправностях работы ПК сообщать персоналу ИВЦ
ВОПРОСЫ ДЛЯ САМОКОНТРОЛЯ
1.Дайте понятие фрейма.
2.Для чего необходим атрибут cols?
3.Для чего необходим атрибут rows?
4.Для чего необходим атрибут bordercolor?
5.Для чего необходим атрибут frameboreder?
6.Для чего необходим атрибут framespacing?
7.Для чего необходим атрибут scrolling?
8.Какой тег необходимо использовать, чтобы ссылки из первого фрейма открывались во втором фрейме?
СОДЕРЖАНИЕ ОТЧЕТА
1.Титульный лист
2.Цель работы
3.HTML-коды web-страниц, содержащие фреймы.
4.Полученный результат.
5.Вывод.
ВРЕМЯ, ОТВЕДЕННОЕ НА ВЫПОЛНЕНИЕ РАБОТЫ
Знакомство с основными понятиями – 1 час.
Выполнение индивидуальных заданий – 7 часов.
СПИСОК ЛИТЕРАТУРЫ
7
1. Автоматизированные информационные технологии: учеб. / под ред.
Г.А.Титаренко.- М.: ЮНИТИ, 2005.
2.Автоматизированные информационные технологии в производстве: Учебник
/Под ред. И.Т. Трубилина - М.: СПбГТУ, 2006.
3.Информационные системы : Учебное пособие / Под ред. В.Н. Волковой, Б.И.
Кузина. СПб.: Изд-во СПбГТУ, 2007. - 216 с.
4. Информационные системы и технологии в экономике и управлении: учеб. /
под ред. проф.В.В. Трофимова. - М.: Высшее образование, 2006.
5. Избачков Ю.С., Петров В.Н. Информационные системы: учеб. для вузов. -
СПб.: Питер, 2005.
СОДЕРЖАНИЕ |
|
Общие понятия |
2 |
Технология выполнения работы |
3 |
Вопросы для самоконтроля |
5 |
Содержание отчета |
6 |
Время, отведенное на выполнение работы |
6 |
Список литературы |
6 |
8
РАБОТА С ФРЕЙМАМИ В HTML
Методические указания к выполнению практических работ по дисциплине «Информационные технологии»
для направления «Информационные системы и технологии» всех форм обучения
Составили: ВАРГИНА Елена Владимировна
Рецензент
Редактор