Практическое занятие №7
Наименование: Использование фреймовой структуры
1. Цель: Научится создавать веб – страницы на основе фреймовой структуры
Подготовка к занятию: по предложенной литературе повторить тему «Фреймы» и ответить на следующие вопросы:
2.1 С помощью какого тега веб – страница разбивается на фреймы?
2.2 С помощью какого атрибута создаются горизонтальные (вертикальные) фреймы?
Литература:
3.1 Шомас Е.А. Конспект лекций по дисциплине «Распределенные системы обработки информации»
3.2 Клименко Р.А. Веб-мастеринг на 100%. – СПб.: Питер, 2013. – 512 с.
3.3 Квинт И. HTML и CSS на 100%. – СПб.: Питер, 2008с
Перечень оборудования и программного обеспечения:
4.1 ПЭВМ, подключенные к сети Интернет
4.2 Браузеры
4.3 Текстовый редактор
Задание:
5.1 В строке заголовка должен отражаться номер практической работы
5.2 В теле документа создайте заголовок первого уровня, где укажите наименование работы. Заголовком второго уровня – цель работы.
5.3 Создайте страницу с фреймовой структуры по следующему принципу:
- Фрейм 1 – занимает 30% от общего размера окна, в нем должна располагаться ссылка
- Фрейм 2 – занимает 80% от общего размера окна, в нем должен располагаться текс и рисунки
- Фрейм 3 – должен содержать сведения об авторе работы
- Каждый фрейм должен быть оформлен в разной цветовой гамме
|
Фрейм 1 |
Фрейм 2
|
|
Фрейм 3 |
Порядок выполнения работы:
6.1 По предложенной литературе изучить необходимый материал и ответить на вопросы для допуска к практическому занятию;
6.2 Выполнить задание практического занятия;
6.3 Дать ответы на контрольные вопросы;
Содержание отчета:
7.1 Наименование и цель работы
7.2 Код программы
7.3 Ответы на контрольные вопросы
7.4 Вывод о проделанной работе
Контрольные вопросы:
8.1 Что такое фрейм? Какие фреймы вы знаете?
8.2 Достоинства и недостатки фреймовой структуры?
ПРИЛОЖЕНИЕ:
Фрейм - это часть страницы, или вернее - место, которое может быть заполнено другой страницей. Чтобы разделить страницу на фреймы необходимо заменить пару тегов <BODY> … </BODY> парой тегов <FRAMESET> ... </FRAMESET>.
Необходимо также указать хотя бы один из атрибутов COLS или ROWS. При помощи этих атрибутов задают размеры фреймов, а также количество строк и столбцов в разбиении страницы. Атрибут COLS определяет количество строк, а атрибут ROWS – количество столбцов в разбиении страницы. Например:
<FRAMESET cols="200,*"> … </FRAMESET>
Для заполнение областей фрейм необходимо прописать:
< FRAMESET cols="200,*"> <FRAME src="Menu.html"> <FRAME src="Body.html"> </FRAMESET>
Тег <FRАМЕ> определяет внешний вид и поведение фрейма. Этот тег не имеет закрывающего тега, но имеет следующий обязательный атрибут: SRC="..." - адрес страницы во фрейме.
Практическое занятие №8
Наименование: Создание анкеты на основе форм
1. Цель: Научится использовать различные виды форм на веб - страницах
Подготовка к занятию: по предложенной литературе повторить тему «Конструирование форм» и ответить на следующие вопросы:
Перечислите основные теги организации форм?
Какие атрибуты и значения принимает тег <INPUT>?
Как организуется текстовое поля для сбора комментариев от посетителей сайта?
Литература:
3.1 Шомас Е.А. Конспект лекций по дисциплине «Распределенные системы обработки информации»
3.2 Клименко Р.А. Веб-мастеринг на 100%. – СПб.: Питер, 2013. – 512 с.
3.3 Квинт И. HTML и CSS на 100%. – СПб.: Питер, 2008с
Перечень оборудования и программного обеспечения:
4.1 ПЭВМ, подключенные к сети Интернет
4.2 Браузеры
4.3 Текстовый редактор
Задание:
5.1 Создайте форму заявки на участие в конференции по следующему образцу:
Порядок выполнения работы:
6.1 По предложенной литературе изучить необходимый материал и ответить на вопросы для допуска к практическому занятию;
6.2 Выполнить задание практического занятия;
6.3 Дать ответы на контрольные вопросы;
Содержание отчета:
7.1 Наименование и цель работы
7.2 Код программы
7.3 Ответы на контрольные вопросы
7.4 Вывод о проделанной работе
Контрольные вопросы:
8.1 Назначение форм при создании сайта?
8.2 Основные виды форм?
ПРИЛОЖЕНИЕ:
Формы помогают организовать взаимодействие пользователя с авторами сайта. Главное при создании форм – следить за тем, чтобы предложенные вами поля были удобны для посетителей и приемлемы для ответов на ваши вопросы.
Форма определяется тегами:<FORM>...</FORM>.Тег <FORM> всегда записывается с обязательным атрибутом ACTION, который используется для того, чтобы соединить вашу форму с программой по сбору данных.
<FORM ACTION="URL"> Содержание формы с тегами и атрибутами. </FORM>
Содержание формы - это теги для сбора данных (они всегда используются вместе с атрибутами): <INPUT> - это тег для сбора информации от посетителей ваших страниц и её сохранения для последующей обработки. NAME=".." - это атрибут - метка, для обработки собранных данных механизмом CGI. TYPE=".." - это атрибут, который указывает на способ обработки собранных данных. Атрибуты NAME и TYPE используются совместно с тегом INPUT
<FORM ACTION="URL"> <INPUT NAME="метка 1"> <INPUT TYPE="submit"> Остальная часть формы... </FORM>