Отримання знань
дистанційна підтримка освіти школярів
ПРАКТИЧНА РОБОТА
Тема уроку. Фрейми. Створення HTML-документів із фреймами. Створення та заповнення таблиць у Web-сторінці
Мета уроку. Закріплення знань про найбільш поширені дискриптори, можливості задання кольору, шрифту, вирівнювання тексту; повторення відомостей щодо створення внутрішніх та зовнішніх зсилок, використання різних типів зсилок; ознайомлення з поняттям “фрейм”; формування вмінь та навичок створення фреймів (у тому числі, вкладених) та організації переміщення між ними, створення таблиць та задання параметрів їх складових елементів
Тип уроку. Практична робота
Час. 1 год 30 год
Обладнання. Текстовий редактор Блокнот або Word Pad, завдання для роботи
ХІД РОБОТИ
1. Відкрийте текстовий редактор Блокнот.
2. Створіть Web-сторінку, що міститиме 2 фрейми за зразком:
3. Збережіть під назвою Frame.htm у власній папці.
4. Перегляньте створену Web-сторінку..
◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊
5. Підготуйте шаблон для Web-сторінки Menu.htm, набравши:
6. Задайте фонову картинку та колір тексту на власний смак.
7. Використовуючи дескриптори для нумерованого та маркованого списків, створіть меню:
8. Скориставшись тегами <B> … </B> та <I> … </I>, встановіть накреслення напівжирне та курсивом для вищеподаного тексту.
9. Додайте зсилку з пункту “Тлумачний словник деяких мір”, дописавши:
10. Збережіть Web-сторінку під назвою Menu.htm.
11. Перегляньте створену Web-сторінку.
◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊
12. Підготуйте шаблон для Web-сторінки Miru_dovg.htm, набравши:
13. Оформіть тлумачний словник деяких мір, дописавши:
14. За вказаним зразком допишіть наступні терміни:
15. Збережіть Web-сторінку під назвою Miru_dovg.htm та перегляньте її.
◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊
16. Організуйте відкриття Web-сторінки Miru_dovg.htm та перехід до потрібної інформації при натисканні на відповідному підпункті меню “Тлумачний словник деяких мір”:
16.1. Відкрийте HTML- код Web-сторінки Menu. htm.
16.2. Допишіть перед і після слова “метр” за зразком:
16.3. Аналогічно оформіть інші пункти (ставити #002, #003, …)
16.4. Відкрийте HTML- код Web-сторінки Miru_dovg.htm.
16.5. Допишіть перед і після означення слова “метр” за зразком:
16.6. Аналогічно оформити інші пункти (ставити 002, 003, …)
17. Збережіть внесені зміни.
18. Перевірте правильність роботи посилань.
◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊
19. Підготуйте шаблон для Web-сторінки Table_Mir.htm, набравши:
20. Задайте колір фону та тексту.
21. Створіть таблицю співвідношення мір за зразком:
22. Задайте за зразком накреслення тексту напівжирним та курсивом і вирівнювання - по центру.
23. Збережіть Web-сторінку під назвою Table_Mir.htm.
◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊
25. Організуйте відкриття Web-сторінки Table_Mir.htm у вікні фрейму при натисканні на пункті меню “Стародавні вітчизняні міри місткості (для рідин)”, дописавши у HTML- коді сторінки Menu.htm:
26. Додайте до Web-сторінки файлу Table_Mir.htm посилання для повернення до основної сторінки:
26.1. Відкрийте Web-сторінку Table_Mir.htm у режимі HTML.
26.2. Допишіть:
27. Створіть Web-сторінку OsnStr.htm із рухомим рядком “Оберіть потрібний пункт меню”.
28. Додайте малюнок “HTML_measure_ length_Х.jpg” із завантаженого раніше архіву малюнків.
29. Перевірте правильність переходів між зв‘язаними Web-сторінками, відкривши сторінку Frame.htm.
◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊ ♦ ◊