55166

Використання фреймів в html-документах

Практическая работа

Педагогика и дидактика

Мета роботи: навчитись застосовувати фрейми при створенні html-документів. 1 Підготовка до заняття 1. Вивчити відповідні розділи теоретичної частини методички та відповідного лекційного курсу. 2. Підготувати малюнки в Pаint та зберегти їх як fon1.bmp та fon2.bmp.

Украинкский

2014-03-22

488 KB

6 чел.

ПРАКТИЧНЕ ЗАНЯТТЯ № 3.  Використання фреймів в html-документах

Мета роботи: навчитись застосовувати фрейми при створенні html-документів.

1 Підготовка до заняття

1. Вивчити відповідні розділи теоретичної частини методички та відповідного лекційного курсу.

2. Підготувати малюнки в Pаint та зберегти їх як fon1.bmp та fon2.bmp.

2 Порядок виконання роботи

  1.  Створити шаблон HTML-документа зберігши його під іменем Lab3.html.
  2.  Задати ім'я документа за таким зразком: "Практичне заняття №3 - Прізвище Ім'я - Група".
  3.  Розділити вікно браузера на три фрейма putannya.html, name.html та vidpovid.html (див. зразок виконання в додатку В). Фрейм putannya.html повинен мати ширину 30% від ширини вікна браузера. Фрейм name.html повинен мати висоту 210 пікселів. Простір, що лишається повинен займати фрейм vidpovid.html.
  4.  Фрейм putannya.html відобразити з рамками, лінійкою прокрутки, без можливості зміни його розмірів, ім'я фрейма -putannya, відстань між фреймами 10 пікселів, колір сітки фрейма - зелений.
  5.  Фрейм name.html відобразити з рамками, без лінійки прокрутки, з можливістю зміни його розмірів, ім'я фрейма - name, відстань між фреймами 5 пікселів, колір сітки фрейма - червоний.
  6.  Фрейм vidpovid.html відобразити з рамками, з лінійкою прокрутки, яка при необхідності автоматично з'являється, з можливістю зміни його розмірів, ім'я фрейма - vidpovid, відстань між фреймами 5 пікселів, колір сітки фрейма - червоний, ширина лівого і правого полів - 100 пікселів, а верхнього і нижнього - 50 пікселів.
  7.  У випадку, коли браузер не підтримує фрейми, має відображатись відповідне повідомлення.
  8.  Створити шаблон HTML-документа зберігши його під іменем putannya.html.
  9.  Задати ім'я документа за таким зразком: "Практичне заняття №3 - Прізвище Ім'я - Група".
  10.  Задати фон документа - малюнок fonl.bmp.
  11.  Задати базовий шрифт документа: розмір - 2, гарнітура - Агіаl, колір - синій.
  12.  Створити біжучий рядок шрифтом на 1 більшим за базовий, синього кольору: "ПИТАННЯ".
  13.  Вставити горизонтальну роздільну лінію довжиною 80% від ширини вікна браузера, товщиною 7 пікселів, червоного кольору, розміщену по центру.
  14.  Перших 5 питань анкети (див. Лабораторну роботу №1) подати  списком визначень (див. зразок виконання), де термін - це номер питання (виділений жирним шрифтом), а визначення - це саме питання (виділене курсивом).
  15.  Питання 6-9 подати у вигляді впорядкованого списку (див. зразок виконання) де перша частина питання має нумерацію 6-9, виділена жирним курсивом, а друга - має нумерацію a-d, розміщена з відступом і має базові параметри.
  16.  Питання 10-12 подати у вигляді невпорядкованого списку (див. зразок виконання) з маркерами у вигляді кола (circle), квадрата (square) та диска (disk).
  17.  Через два рядки зробити посилання на закладку, яка розміщена на початку сторінки словом ВГОРУ та символом виділених жирним шрифтом.
  18.  Створити шаблон HTML-документа зберігши його під іменем name.html.
  19.  Задати ім'я документа за таким зразком: "Практичне заняття № 3 - Прізвище Ім'я - Група".
  20.  Задати фон документа - малюнок fon2.bmp.
  21.  Задати базовий шрифт документа: розмір - 3, гарнітура - Агіаl, колір - жовтий.
  22.  Створити біжучий рядок: "Прізвище Ім'я - Група".
  23.  Текст "Практичне заняття № 3" оформити заголовком другого рівня, розміщеним по центру із спливаючим поясненням "ФРЕЙМИ" при наведенні на нього мишкою.
  24.  Текст "Тема: Використання фреймів в html-документах" оформити заголовком третього рівня, розмішеним по центру, причому текст "Тема:" повинен відображатись жирним підкресленим шрифтом, а "Використання фреймів в html-документах" - жирним курсивом.
  25.  Вставити горизонтальну роздільну лінію довжиною 80% від ширини вікна браузера, товщиною 7 пікселів, зеленого кольору, розміщену по центру.
  26.  Створити шаблон HTML-документа зберігши його під іменем vidpovid.html.
  27.  Задати ім'я документа за таким зразком: "Практичне заняття № 3 - Прізвище Ім'я - Група".
  28.  Задати фон документа жовтим кольором.
  29.  Задати базовий шрифт документа: розмір - 3, гарнітура - Агіаl, колір - білий.
  30.  Створити біжучий рядок шрифтом на 2 більшим за базовий, червоного кольору: "ВІДПОВІДІ НА ПИТАННЯ".
  31.  Вставити горизонтальну роздільну лінію довжиною 80% від ширини вікна браузера, товщиною 7 пікселів, синього кольору, розміщену по центру.
  32.  Відповіді на питання подати у вигляді списку визначень в режимі компактного відображення (див. зразок виконання), де термін - це номер відповіді на питання (виділений жирним шрифтом), а визначення - це текст відповіді (виділений курсивом).

3 Вимоги до оформлення звіту

1. Оформити звіт та захистити роботу (знання використаних у роботі тегів).

ДОДАТОК В

Вигляд створеного документу

Лістінг розмітки документа до практичного заняття №3  (Lab3.html)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//RU"> <HTML>

<HEAD>

<TITLE>Практичне заняття №3 - Іванов Іван - ПHК-31</TITLE>

</HEAD>

<FRAMESET COLS=30%,* FRAMEBORDER=yes FRAMESPACING=10 BORDERCOLOR=green>

<FRAME SRC=putannya.html NAME=putannya NORESIZE SCROLLING=yes>

<FRAMESET ROWS=210,* FRAMEBORDER=yes FRAMESPACING=5 BORDERCOLOR=red>

<FRAME SRC=name.html NAME=name SCROLLING=no>

<FRAME SRC=vidpovid.html NAME=vidpovid MARGINWIDTH=100 MARGINHEIGHT=50 SCROLLING=auto> </FRAMESET>

<NOFRAMES>Baш браузер не підтримує фрейми</NOFRAMES>

</FRAMESET>

<BODY> </BODY> </HTML>

putannya.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//RU">

<HTML>

<HEAD>

<TITLE>Практичне заняття №3 - Іванов Іван - ПНК-31</TITLE> </HEAD>

<BODY BACKGROUND=fon1.bmp>

<A NAME="zakladka"></a>

<BASEFONT SIZE="2" FACE="Arial" COLOR="blue">

<MARQUEE direction="left"><FONT SIZE=+1 COLOR=BLUE>ПИTAHHЯ</FONT></MARQUEE>

<HR WIDTH="80%" SIZE="7" ALIGN="center" COLOR="red"><BR>

<DL>

<DT><B>1</B></DT>

<DD><I>Чомy ви обрали саме цей університет?</I></DD>

<DT><B>2</B></DT>

<DD><I>Улюблені предмети в університеті. Чому? Ваші побажання.</I></DD>

<DT><B>3</B></DT>

<DD><I>Як ви відноситесь до спорту. Чим займаєтесь і чим хотіли б займатись?</I></DD>

<DT><B>4</B></DT>

<DD><I>Baшe відношення до музики, улюблені групи, виконавці?</I></DD>

<DT><B>5</B></DT>

<DD><I>Baшi уподобання у кіно, театрі, мистецтві (жанр, актори, митці).</I></DD>

<DL><BR>

<OL TYPE="1" START="6"><B>

<LI><I>Як проводите вільний чac?</I></B></OL>

<BLOCKQUOTE><OL TYPE="a">

<LI> Ваше xoббi?</OL></BLOCKQUOTE>

<OL TYPE="1" START="7"><B>

<LI><I>Улюблені свята?</I></B></OL>

<BLOCKQUOTE><OL TYPE="a">

<LI VALUE=2>Чим і чомy?</OL></BLOCKQUOTE>     .

<OL TYPE="1" START="8"><B>

<LI><I>Як ви відноситесь до астрологічних прогнозів?</I></B></OL>

<BLOCKQUOTE><OL TYPE="a">

<LI VALUE=3>Чомy?</OL></BLOCKQUOTE>

<OL TYPE="1" START="9"><B>

<LI><I>Де ви хотіли б відпочити?</I></B></OL>

<BLOCKQUOTE><OL TYPE="a">

<LI VALUE=4> Чомy?</OL></BLOCKQUOTE>

<UL>

<LI TYPE="circle"><B>10.</B> <I>У якій країні ви хотіли б проживати і чому?</I>

<LI TYPE="square"><B>11.</B><I>Ваш ідеал людини?</I>

<LI TYPE="disc"><B>12.</B><I> Як би ви сформулювали мету вашого життя?</I></UL>

   <BR><BR>

<a href="#zakladka"> <DD><B>ВГОРУ&#8593</B></DD> </a>

</BODY> </HTML>

  name.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//RU"> <HTML>

<TITLE>Практичне заняття № 3 - Іванов Іван - ПНК-31</TITLE>

</HEAD>

<BODY BACKGROUND=fon2.bmp>

<BASEFONT SIZE="3" FACE="Arial" COLOR="yeIlow">

<MARQUEE direction="left">Іванов Іван - ПНК-31</MARQUEE>

<H2 ALIGN="center"><ACRONYM TITLE="ФРЕЙМИ"> Практичне заняття № 3</ACRONYM></H2>

<H3 ALIGN="center"><B><U>Teмa:</U><I>Використання фреймів, навігаційних карт та форм в html-документах</I></B></H3>

<HR Width="80%" SIZE="7" ALIGN="center" COLOR="green">

<BR>

</BODY> </HTML>

vidpovid.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//RU">

<HTML> <HEAD>

<TITLE>Практичне заняття №3 - Іванов Іван - ПНК-31 </TITLE>

</HEAD>

<BODY BGCOLOR="yellow">

<BASEFONT SIZE="3" FACE="Arial" COLOR="green">

<MARQUEE direction="left"><FONT SIZE=+2 COLOR=red>ВІДПОВІДІ НА ПИТАННЯ </FONT></MARQUEE>

<HR WIDTH="80%" SIZE="7" ALIGN="center" COLOR="blue"><BR>

<DL COMPACT>

<DT><B>Відповідь на питання 1</B></DT>

<DD><I>Teкст відповіді</I></DD>

<DT><B>Відповідь на питання 2</B></DT>

<DD><I>Teкст відповіді</I></DD>

<DT><B>Відповідь на питання 3</B></DT>

<DD><I>Teкст відповіді</I></DD>

<DT><B>Відповідь на питання 4</B></DT>

<DD><I>Teкст відповіді</I></DD>

<DT><B>Відповідь на питання 5</B></DT>

<DD><I>Teкст відповіді</I></DD>

<DT><B>Відповідь на питання 6</B></DT>

<DD><I>Teкст відповіді</I></DD>

<DT><B>ВІдповідь на питання 7</B></DT>

<DD><I>Teкст відповіді</I></DD>

<DT><B>Відповідь на питання 8</B></DT>

<DD><I>Teкст відповіді</I></DD>

<DT><B>Відповідь, на питання 9</B></DT>

<DD><I>Teкст відповіді</I></DD>

<DT><B>Відповідь на питання 10</B></DT>

<DD><I>Teкст відповіді</I></DD>

<DT><B>Відповідь на питання 11</B></DT>

<DD><I>Teкст відповіді</I></DD>

<DT><B>Відповідь на питання 12</B></DT>

<DD><I>Teкст відповіді</I></DD>

</DL>

</BODY>

</HTML>


 

А также другие работы, которые могут Вас заинтересовать

77589. Триггеры. Не тактируемые и тактируемые триггеры 231 KB
  Устройство имеющее два устойчивых состояния называют триггером. С приходом переключающих запускающих сигналов переход триггера из одного состояния в другое происходит лавинообразно и потенциалы на выходах меняются на противоположные.
77590. Андрей Тимофеевич Болотов 53.56 KB
  Так, например, обстоит дело с определением места в истории нашей страны Андрея Тимофеевича Болотова. Выдающийся деятель, внесший неоценимый вклад в развитие науки и культуры, основоположник русской сельскохозяйственной науки, к сожалению, до сих пор не получил должного признания своих заслуг.
77591. Тэер Альбрехт Даниель (1752-1828) - немецкий агроном. Автор гумусовой теории питания растений 224.26 KB
  Альбрехт Тэер родился 14 мая 1752 года в семье врача, служившего при дворе ганноверского курфюрста. В молодости пошёл по стопам отца, окончил медицинский факультет университета в Гёттингене (1774). По возвращении в родной Целле получил по наследству должность личного врача курфюрста Ганновера Георга III.
77592. Устройства печати 2.15 MB
  По принципу переноса изображения на носитель: литерные; матричные; лазерные; струйные; сублимационные; По количеству цветов печати: чёрно-белые монохромные; цветные. Основная часть линейно-матричного принтера это конструкция состоящая из станины имеющей ширину печати...
77593. Формирование и использование местных финансов 124.5 KB
  Формирование и использование местных финансов основываются на принципах самостоятельности государственной финансовой поддержки и гласности осуществляются в соответствии с Конституцией Российской Федерации Федеральным законом...
77594. Функции полиции и борьба с преступностью 230 KB
  В сегодняшней России со всей очевидностью проявляется настоятельная необходимость борьбы с такими антиобщественными явлениями, как пьянство, профессиональное нищенство, азартные игры, что, в свою очередь, требует обратиться к соответствующему историческому опыту.
77595. Проектування просторових тонкостінних покриттів конспект лекцій 1.9 MB
  Основи проектування просторових залізобетонних конструкцій. Пологі оболонки додатної гаусової кривизни, прямокутні в плані. Оболонки від’ємної гаусової кривизни, прямокутні в плані. Довгі циліндричні оболонки. Короткі циліндричні оболонки та призматичні складки. Загальні поняття та конструювання
77596. Чернігівський колегіум 450.5 KB
  Результатом плідної співпраці архієпископів і викладачів колегіуму стала низка друкованих прозових та віршованих творів відомих широкому загалу тогочасного суспільства. Викладачі та вихованці колегіуму проводили значну просвітницькопедагогічну діяльність...