KNOWLEDGE HYPERMARKET


Конспект урока: Работа с изображениями и логическими тэгами

Гіпермаркет Знань>>Інформатика 11 клас>>Інформатика>> Інформатика: Основи веб-дизайну


План-конспект уроку з курсу «Інформатика 11 клас» з теми «Работа с изображениями и логическими тэгами»


                                                                         Урок  № 5.

                                        Работа с изображениями и логическими тэгами.

Цели:

• Образовательные:
- Сформировать первоначальные представления о работе с изображениями в html.
- Познакомиться со способами форматирования изображений в html.

• Развивающие:
- умения анализировать, сравнивать, систематизировать и обобщать;
- интерес к учению, стремление к расширению кругозора;

• Воспитательные:
- бережное отношение к имуществу, ВТ и учебным пособиям;
- дисциплинированность, любознательность.

                                                                      Ход урока:

> Организационный момент.
> Проверка д/з: тест на компьютере «Работа с текстом»
> Объяснение нового материала.


Повторение и актуализация знаний.
Краткий но обязательный разговор о структуре сайта.
Учимся вставлять картинку. Подробно на примерах разбираем как правильно прописывать источник в html коде.
Рассказываем о теге <div> и его применении.
Используя тег <div>, покажем, как можем выровнять картинку по центру.
 Рассматриваем дополнительные атрибуты тега <img>:  

src="img/HTML.jpg" - источник (путь) к изображению
border="5" - рамка и её толщина
align="left" - смещение относительно текста
hspace="30" - горизонтальный интервал между изображением и обтекающим его текстом
vspace="30" - вертикальный интервал между изображением и обтекающим его текстом
width="100" - ширина изображения
height="70"- высота изображения
alt="текст который будет виден если отображение изображений отключено в браузере"
Говорим об обтекании

> Закрепление изученного материала:
Выполнить упражнение к уроку 5.

Задание на дом:
Изучить материал в тетради наизусть.

Упражнение к уроку 5:


1. Вставить предложенный рисунок на html-страницу.
2. Отформатировать рисунок и выровнять его в тексте на ваше усмотрение.
3. Задать отступы от границы текста до рисунка равными 15 пикселей по горизонтали и по вертикали.

Сохраните файл как "img.html".

Надіслав вчитель інформатики Тарасов Дмитро.

Основи веб-дизайну > Основи веб-дизайну. Конспект уроку і опорний каркас