1. ЛАБОРАТОРНО-ПРАКТИЧНА РОБОТА №4
ТЕМА. Основні прийоми роботи з Web-сторінками. Застосування фреймів.
МЕТА: ознайомлення з основними прийомами роботи з Web-сторінками. Навчитися застосовувати
фрейми для роботи з HTML-документами.
ТРИВАЛІСТЬ ЗАНЯТТЯ: 3 години.
МІСЦЕ ПРОВЕДЕННЯ: кабінет інформатики.
МАТЕРІАЛИ ТА ОБЛАДНАННЯ: персональні комп’ютери, інструкції, програмне забезпечення: ОС Windows
XP, Блокнот.
МЕТОД ПРОВЕДЕННЯ: індивідуальний.
Теоретичні відомості
Для швидкого завантаження вашого HTML-документа дуже часто використовують фрейми. Фрейми
розбивають вікно на 2, 3 і навіть більш частин (але не слід захоплюватися). В кожному фреймі відображається свій
документ HTML і кожний з фреймів може мати (або не мати) власних посилань, зображень, смуг прокрутки і багато
чого іншого. Фрейми можуть також функціонувати незалежно один від одного.
Для відображення фреймів необхідні три файли: настановний файл і два початкові файли HTML.
Відкриваючим тегом є <FRAMЕSET>, який вставляється після тега </HEAD>, але до тега <BODY>. Відкриваючий
тег визначає місцерозташування фреймів у вікні браузера. Атрибутами тега <FRAMЕSET> служать:
COLS - фрейми розташовуються по вертикалі
ROWS - фрейми розташовуються по горизонталі
Цим атрибутам привласнюються числові значення, виражені в пікселях або у відсотках. Наприклад:
<FRAMSET COLS="10,50,*">. В даному випадку тег створює три вертикальні стовпці розмірами: перший - 10 пікселів,
другий - 50 пікселів, третій займає частину вікна, що залишилася.
Після тега <FRAMЕSET> вставляється тег <FRAME>, якому можуть привласнюватися наступні атрибути:
SRC= - вказується назва файлу, який розташовуватиметься в тому або іншому фреймі (*)
NAME= - цей атрибут важливий для вказівки на один файл з іншого (*)
BORDER= - визначає ширину розділової смуги між фреймами (вимірюється в пікселях)(*)
BORDERCOLOR= - задає колір розділової смуги (вимірюється в RGB)
NORESIZE - забороняє зміну розмірів фреймів користувачем за допомогою миші
SCROLLING= - задає смуги прокрутки у фреймах. Даний атрибут може мати наступні аргументи:
YES - смуга прокрутки буде видна
NO - смуга прокрутки не буде видна
AUTO - смуга прокрутки задається автоматично
MARGINHEIGHT= - цим атрибутом додається порожнє поле між верхньою межею фрейма і початком тексту
або графіки (вимірюється в пікселях)
MARGINWIDTH= - а цим атрибутом додається порожнє поле між бічними межами фрейма і текстом або
графікою (вимірюється в пікселях)
обов'язковий атрибут для тега <FRAME>
Для браузерів, що не підтримують фрейми, поміщається повідомлення як "тіло" (<BODY>) файлу між тегами
<NOFRAME> і </NOFRAME>.
Наведемо два приклади:
1. <HTML>
<HEAD>
<TITLE> моя перша сторіночка </TITLE> </HEAD>
<FRAMЕSET COLS="30%,* BORDER="1">
<FRAME SRC="file1.htm" NAME="file1”
SCROLLING="AUTO">
<FRAME SRC="file2.htm" NAME="file2”
SCROLLING="AUTO">
</FRAMESET> <BODY> <NOFRAME>
<P> Для перегляду необхідний браузер, що
підтримує фрейми.
</NOFRAME> </BODY> </HTML>
2. <HTML>
<HEAD> <TITLE></TITLE> </HEAD>
<FRAMЕSET ROWS="20%,*"> <FRAME SRC="file3.htm"
NAME="file3 SCROLLING="AUTO">"
<FRAMЕSET COLS="30%,*"> <FRAME SRC="file1.htm"
NAME="file1 SCROLLING="AUTO">"
<FRAME SRC="file2.htm" NAME="file2
SCROLLING="AUTO">" </FRAMESET> </FRAMESET>
<BODY> <NOFRAME>
<P> Для перегляду необхідний браузер, що
підтримує фрейми.
</NOFRAME> </BODY> </HTML>
За допомогою вказівок на фрейм можна змінити файл, розташований в іншому фреймі. Щоб ця вказівка
спрацювала правильно, вимагається виконати наступні умови:
Створюючи фрейм в настановному файлі, необхідно задати його назву
Задаючи посилання, слід використовувати його назву, щоб вказати, в якому фреймі повинен бути зображений
файл HTML, на який є посилання.
Для того, щоб змінився файл, розташований в іншому фреймі, необхідно в тег <A HREF= > додати атрибут
TARGET=, в якому вказати ім'я (NAME), на яке робиться посилання.
Наприклад: Якщо посилання розташовується у файлі file1.htm (лівий фрейм), а необхідно змінювати тільки
правий фрейм, то у файлі file1.htm робиться посилання:
Тут буде <A HREF="file2.htm TARGET="file2"> посилання" </A> на файл file2.htm
ЗАВДАННЯ:
2. 1. Відкрийте текстовий редактор Блокнот.
2. На основі даної web-
сторінки створіть сайт про
країни світу.
3. Добийтеся вдалого
розташування інформації у
фреймах, відформатуйте
тексти, задайте необхідні
параметри в тегах <BODY>.
4. Задайте жовтий фон
для фреймів.
5. Задайте смуги
прокручування.
6. У вузькому верхньому
фреймі розташуйте особисту
емблему з деякого графічного
файлу.
7. У правому нижньому
фреймі організуйте перегляд
сторінок.
8. Удоскональте сайт, щоб він виглядав якнайліпше.
КОНТРОЛЬНІ ЗАПИТАННЯ:
1. Що таке фрейми?
2. Які файли потрібні для створення сайту з фреймами?
3. Яке призначення основного html-файлу?
4. Що відображають зазвичай у лівому фреймі сайту?
5. Які параметри може мати тег <FRAMESET>?
6. Які параметри може мати тег <FRAME>?
7. Яке призначення атрибута ROWS?
8. Як створюються складні конфігурації фреймів?
9. Що означає запис COLS=”30%, *”?
10. Що означає запис COLS=”1*, 4*”?
11. Що означає запис COLS=”120, 240, *”?
12. Які фрейми створить параметр COLS=”25%, 50%, 25%”?
13. Яке призначення параметра TARGET?
14. Яке призначення тега-контейнера NOFRAME?
15. Яке призначення параметра SCROLLING?
16. Яке призначення параметра FRAMEBORDER?
ОФОРМЛЕННЯ РОБОТИ: робота оформляється на стандартних листах (ф. А4) в папках.
Звіт повинен містити:
1. Номер роботи, тему, мету, матеріали та обладнання;
2. Дайте відповіді на контрольні запитання згідно номера в журналі:
Номер в журналі Контрольні запитання
1, 4, 8, 12, 16, 20, 24, 28 15, 11, 13, 7, 4
2, 5, 9, 13, 17, 21, 25, 29 2, 5, 12, 14, 8
3, 6, 10, 14, 18, 22, 26 1, 3, 10, 12, 16
7, 11, 15, 19, 23, 27, 30 6, 9, 2, 5, 11
3. Вкінці роботи має бути написаний висновок.
ОЦІНКА РОБОТИ: робота оцінюється за кінцевими результатами за 12-бальною системою (при захисті
необхідно знати відповіді на всі контрольні запитання).
ЛІТЕРАТУРА:
Глинський Я.М. Інформатика 8-11 класи, Навчальний посібник для загальноосвітніх навчальних
закладів (4-те видання). – Л.: 2004.
Гаєвський О.Ю. Інформатика 7-11 класи, Навчальний посібник. – К.: А.С.К., 2005.
Глинський Я.М., Ряжська В.А. Інтернет, Навчальний посібник, Самоучитель 4-те доповн.вид. –
Львів, 2007
