Преподаватель Гринченко К.Н. svet.keniya@mail.ru

Преподаватель Гринченко К.Н. svet.keniya@mail.ru

Конспект практического занятия по информатике.

29/10/2020

Группа №92 профессия «Тракторист-машинист с/х производства, 2 курс»

Тема:«Знакомство с HTML»

Цель: Познакомить учащихся со структурой HTML-документа.

Урок № 7

Тип урока: индивидуальная, дистанционное обучение.

Необходимое программное обеспечение к уроку:

Microsoft Power Point

Список литературы:

Информатика и ИКТ. Учебник. 11 класс. Базовый и углубленный уровень. / Под ред. Профессора А.Г.Гейн. – М.: Просвещение – 2019.

Ход занятия

Этапы, время.	Деятельность учителя
Орг-ый этап. Мотивационный модуль.	Сегодня мы начнем изучать новый раздел – основы HTML. После того как мы все изучим по HTML будет самостоятельная работа. А сегодня мы разберем структуру HTML-документа.
Основной этап. Объяснительный модуль.	- Начнем с того что же такое HTML. HTML (Hyper Text Markup Languger) – язык гипертекстовой разметки, т.е. – это специальные инструкции к браузеру с помощью которых создаются веб-страницы. - Специальные программы к браузеру называются тегами (<тег>…. </тег>). Тэг– это команда языка HTML, которую выполняет браузер. - Тип файла (расширение) — .htm или .html. - Имя файла HTML-документа не должно содержать кириллицу (т.е. русские буквы), пробел (вместо пробела рекомендуется использовать либо тире, либо знак подчеркивания). - Теперь рассмотрим структуру документа. Запишите в тетрадях: Структура документа: 1. <html> начало документа; 2. <head> начало страницы (голова программы); 3. <title> название страницы </title>; 4. </head> 5. <body> тело документа. - Сейчас запишите структура <body>: <Body text=red bgcolor=blue Background=” имя рисунка”> Link= цвет гиперссылки Vlink= цвет активной гиперссылки Alink= цвет гиперссылки <BODY LINK= #FF8C00 VLINK=green> -Название цвета можно писать как по английски, так же можно использовать шестнадцатеричные коды. -При выборе картинки в качестве фона нужно учитывать, чтобы выбираемый цвет фона сочетался с текстом. -Существует всего 6 уровней заголовочного шрифта. Им соответствуют теги <H1>,<H2>, <H3>, <H4>, <H5>, <H6>. Первый уровень самый крупный. Если вы хотите выбрать другой уровень, то тег нужно закрыть </H1>. - Запишите след.заголовок: Тэги форматирования: <P> абзац <P align= Left (лево) > Center ( по центру) Right ( по правой стороне) Justify ( по ширине) <BR> принудительный разрыв строки <FONT size=7 color=цвет face=”название шрифта”> после чего нужно закрыть </ FONT> <B>жирный</B> <I>курсив </I> <U>подчеркнутый </U> <S>зачеркнутый </S> <center>центрированный</center> <sup>верхний индекс</sup> <sub>нижний индекс </sub> <HR>разделитель, горизонтальная линия идущая через весь экран. <HR SIZE="3" ALIGN="right"> 20 сл. <MARQUEE>….</ MARQUEE> бегущая строка <BIG>….</BIG>текст будет отображаться шрифтом чуть большего размера, чем основной. <SMALL>….<SMALL>текст будет отображаться шрифтом чуть меньшего размера, чем основной. - И последний тег - вставка рисунков: <IMG SRC=”имя.jpg” ALT=”имя”> -Форматы картинок вставляются следующее: .jpg , . gif , .bmp. -Теги должны располагаться строго один внутри другого по принципу хорошо вам известной матрешки. Например: Верная запись Неверная <CENTER>… <CENTER>… <H2>… <H2>… </H2>… </CENTER>… </CENTER>… </H2>… -Для создания HTML-документа в виде HTML-кода всегда будем использовать текстовый редактор Блокнот. Запускаем Блокнот и составляем структуру HTML-документа.
Итог урока. Домашнее задание.	Дома почитайте параграф 29-32.

Работу присылаем в личное сообщение ВКонтакте.