| Головна » Інформатика |
Мета уроку: Навчальна: закріпити знання учнів про команди мови (теги) HTML,технологію створення HTML-файлу, ознайомити учнів з тегами для роботи з фоном та тегами для задання кольору, навчити створювати найпростіші веб-сторінки Тип уроку: урок засвоєння нових знань Обладнання: мультимедійний комплекс(проектор,ноутбук), картки із завданнями. Хід уроку: Організаційний момент. І. Мотивація навчальної' діяльності учнів Мандруючи просторами Інтернету чи задумувалися ви над тим, чому одна сторінка має привабливий вигляд, а інша не дуже? На всі ці питання ми сьогодні на уроці знайдемо відповідь. Оголошення, представлення теми та очікуваних навчальних результатів Отже, тема нашого уроку «Мова програмування HTML. Теги для роботи з фоном.Теги для задання кольору» Мета уроку; закріпити знання учнів про команди мови (теги) HTML,технологію створення HTML-файлу, ознайомити учнів з тегами для роботи з фоном та тегами для задання кольору, навчити створювати найпростіші веб-сторінки
Після цього уроку учні зможуть: пояснювати поняття "веб-документ", пояснювати, для чого призначена мова розмітки документа – HTML; Надання необхідної інформації Файл даних, фрагменти якого розмічені тегами мови HTML, називається HTML-документом. Ім’я такого файла звичайно має розширення.htm чи.html Створення HTML-документа відбувається розташуванням тегів (команд) мови HTML всередині звичайного неформатованого тексту. Теги HTML — це послідовності символів, які починаються знаком «менше» (<) і закінчуються знаком «більше» (>). Теги можуть мати атрибути, які, в свою чергу, можуть приймати певні значення. Правила роботи в мові розмітки документа HTML Пробіли та інші «невидимі символи» ігноруються.
Позначення HTML-документа
<HTML>... < /HTML> - включають в себе всі інші теги HTML і весь інформаційний зміст документа. <HTML> розташовується у першому рядку документа; < /HTML> - у останньому рядку. Заголовок документа <HEAD>... </HEAD> - містить інформацію про документ. Назва документа <TITLE>... </TITLE> - назва документа, яка відображається в рядку заголовка internet Explorer. Тіло документа <BODY>,..</BODY> - тіло документа містить весь текст з інформацією і всі теги HTML, які використовуються для форматування тексту.
IV. Інтерактивні вправи Робота в групах (вчитель об’єднує учнів в групи за порами року(осінь, зима весна, роздає картки із завданням (див.додатки 1, 2, 3)
При розробці сторінок можна використати теги з атрибутами, які впливають на колір фону і тексту сторінки. Колір фону і тексту може задаватись шістнадцятковими значеннями RRGGBB (Red, Green, Blue) червоного, зеленого і синього кольорів відповідно або позначеннями кольорів англійською мовою. наприклад: Червоний Red #FFOOOO Зелений Green #OOFFOO Синій Blue #OOOOFF Тег <BODY> містить список додаткових параметрів, які управляють використанням фонових зображень і визначають кольори гіпертекстових посилань і тексту. Атрибути тегу <BODY> BGCOLOR Задає колір фону TEXT Задає колір тексту BACKGROUND Визначає зображення, яке використовується як фонове. Для визначення кольору фону документа тег <BODY> записується таким чином:
<BODY BGCOLOR=#FFOOOO> або <BODY BGCOLOR=RED> - фон документа буде червоного кольору. <BODY TEXT=RED> - колір тексту в документі буде червоним.
Атрибути можуть бути записані одночасно: <BODY BGCOLOR=RED TEXT=WHITE> - колір фону червоний, колір тексту - білий.
Завдання (група «Осінь») Дайте відповіді на питання(письмово в зошитах) 1.Який атрибут тегу<BODY> використовується для оформлення кольором фону веб-сторінки? 2.Як може задаватись колір в тегах для оформлення фону,тексту?
Завдання(група «Зима») Дайте відповіді на питання: 1.Який атрибут тегу<BODY> використовується для оформлення кольором тексту веб-сторінки? 2.Як може задаватись колір в тегах для оформлення фону?
Завдання(група «ВЕСНА») Дайте відповіді на питання: 1.Який атрибут тегу<BODY> використовується для оформлення кольором фону і одночасно тексту веб-сторінки? 2.Як може задаватись колір в тегах для оформлення фону, тексту? Робота за комп`ютером За даним алгоритмом і шаблоном створити свою першу веб-сторінку задати.Кольори фону та тексту задати за власним бажанням Структура HTML-документа має вигляд <HTML> <HEAD> <TITLE> Тестова сторінка</TITLE> </HEAD> <BODY> Моя перша веб-сторінка і вона мені дуже подобається! </BODY> </HTML> Порядок створення Web-документа:
У головному меню WINDOWS вибрати пункт Пуск-Программы -Стандартные -Блокнот. 3. Зберегти створений документ, обов'язково надавши йому розширення *.htm 4. Перевірити вигляд створеної гіпертекстової сторінки. Для перевірки одержаної сторінки завантажити Internet Explorer, відкрити меню File, вибрати команду Open file, завантажити створений файл. 5 Для внесення змін повернутись до програми Блокнот, внести зміни, зберегти файл. 6. Активізувати Internet Explorer, натиснути кнопку Обновить.
v.Підбиття підсумків.Оцінювання результатів VI.Домашнє завдання Вивчити теоретичний матеріал та підготуватись до практичної роботи
Схожі навчальні матеріали: | ||||||
| Всього коментарів: 0 | |