Добавить материал и получить бесплатное свидетельство о публикации в СМИ
Эл. №ФС77-60625 от 20.01.2015
Свидетельство о публикации

Автоматическая выдача свидетельства о публикации в официальном СМИ сразу после добавления материала на сайт - Бесплатно

Добавить свой материал

За каждый опубликованный материал Вы получите бесплатное свидетельство о публикации от проекта «Инфоурок»

(Свидетельство о регистрации СМИ: Эл №ФС77-60625 от 20.01.2015)

Инфоурок / Информатика / Презентации / Презентация к уроку "Язык разметки гипертекста"
ВНИМАНИЮ ВСЕХ УЧИТЕЛЕЙ: согласно Федеральному закону № 313-ФЗ все педагоги должны пройти обучение навыкам оказания первой помощи.

Дистанционный курс "Оказание первой помощи детям и взрослым" от проекта "Инфоурок" даёт Вам возможность привести свои знания в соответствие с требованиями закона и получить удостоверение о повышении квалификации установленного образца (180 часов). Начало обучения новой группы: 28 июня.

Подать заявку на курс
  • Информатика

Презентация к уроку "Язык разметки гипертекста"

библиотека
материалов
Язык разметки гипертекста Терминология HTML. Методика использования. Основные...
План занятия История НТМL Терминология 2. Основы форматирования HTML-документ...
HTML HyperText Markup Language - язык разметки гипертекста
Гипертекст - специальным образом организованный текст, позволяющий пользовате...
История 1969 - Чарльз Гольдфарб создает прототип языка для разметки техническ...
Терминология Элемент - это конструкция языка HTML предписывающая способ интер...
Терминология - это конструкция языка HTML предписывающая способ интерпретации...
Терминология - это конструкция языка HTML предписывающая способ интерпретации...
Терминология - это конструкция языка HTML предписывающая способ интерпретации...
Терминология - это конструкция языка HTML предписывающая способ интерпретации...
Терминология - это конструкция языка HTML предписывающая способ интерпретации...
Терминология - это конструкция языка HTML предписывающая способ интерпретации...
Терминология - это конструкция языка HTML предписывающая способ интерпретации...
Терминология - это конструкция языка HTML предписывающая способ интерпретации...
Терминология - это конструкция языка HTML предписывающая способ интерпретации...
Терминология - это конструкция языка HTML предписывающая способ интерпретации...
Терминология - это конструкция языка HTML предписывающая способ интерпретации...
Терминология - это конструкция языка HTML предписывающая способ интерпретации...
Терминология - это конструкция языка HTML предписывающая способ интерпретации...
Терминология - это конструкция языка HTML предписывающая способ интерпретации...
Тег - единица разметки, стартовый или конечный маркер элемента. Запись старто...
ИНТЕРГРАД
Атрибут - параметр или свойство элемента. Запись стартового тега с атрибутом...
Наиболее распространенные атрибуты align-выравнивание width - ширина в пиксел...
HTML-документ - текстовый документ содержимое которого размечено при помощи э...
Вложенность элементов
Гиперссылка - объект интерпретируемого документа служащий указателем на друго...
URL – (Universal Resource Locator) универсальный указатель ресурса Например:...
HTML - документ   Структура гипертекстового документа Заголовок Первый абзац...
Заголовок   Первый абзац документа  Последний абзац документа   HTML - доку...
Программа-браузер HTML - документ   Заголовок Первый абзац документа  ……… Пос...
Программа-браузер HTML - документ   Заголовок Первый абзац документа  ……… Пос...
Программа-браузер HTML - документ   Заголовок Первый абзац документа  ……… Пос...
Программа-браузер HTML - документ   Заголовок Первый абзац документа  ……… Пос...
Программа-браузер HTML - документ   Заголовок Первый абзац документа  ……… Пос...
Программа-браузер HTML - документ   Заголовок Первый абзац документа  ……… Пос...
Программа-браузер HTML - документ   Заголовок Первый абзац документа  ……… Пос...
Программа-браузер HTML - документ   Заголовок Первый абзац документа  ……… Пос...
Программа-браузер HTML - документ   Заголовок Первый абзац документа  ……… Пос...
Программа-браузер HTML - документ   Заголовок Первый абзац документа  ……… Пос...
Программа-браузер HTML - документ   Заголовок Первый абзац документа  ……… Пос...
Программа-браузер HTML - документ   Заголовок Первый абзац документа  ……… Пос...
Программа-браузер HTML - документ   Заголовок Первый абзац документа  ……… Пос...
Программа-браузер HTML - документ   Заголовок Первый абзац документа  ……… Пос...
Программа-браузер HTML - документ   Заголовок Первый абзац документа  ……… Пос...
Программа-браузер HTML - документ   Заголовок Первый абзац документа  ……… Пос...
Основные элементы HTML Разметка текста Создание списков Создание таблиц Графи...
Разметка текста Примеры логической разметки Примеры визуальной разметки
Заголовки Заголовок Пример записи для форматирования:
Вставка картинки  Запись элемента в общем виде:  Пример: Использование атрибу...
Организация гиперссылки Текст ссылки Запись элемента в общем виде: Пример: Вн...
51 1

Подайте заявку сейчас на любой интересующий Вас курс переподготовки, чтобы получить диплом со скидкой 50% уже осенью 2017 года.


Выберите специальность, которую Вы хотите получить:

Обучение проходит дистанционно на сайте проекта "Инфоурок".
По итогам обучения слушателям выдаются печатные дипломы установленного образца.

ПЕРЕЙТИ В КАТАЛОГ КУРСОВ

Описание презентации по отдельным слайдам:

№ слайда 1 Язык разметки гипертекста Терминология HTML. Методика использования. Основные
Описание слайда:

Язык разметки гипертекста Терминология HTML. Методика использования. Основные конструкции.

№ слайда 2 План занятия История НТМL Терминология 2. Основы форматирования HTML-документ
Описание слайда:

План занятия История НТМL Терминология 2. Основы форматирования HTML-документа. 3. Изображения в HTML-документах. 4. Организация гиперссылки.

№ слайда 3 HTML HyperText Markup Language - язык разметки гипертекста
Описание слайда:

HTML HyperText Markup Language - язык разметки гипертекста

№ слайда 4 Гипертекст - специальным образом организованный текст, позволяющий пользовате
Описание слайда:

Гипертекст - специальным образом организованный текст, позволяющий пользователю осуществлять по указателям мгновенный переход к связанным ресурсам. Терминология

№ слайда 5 История 1969 - Чарльз Гольдфарб создает прототип языка для разметки техническ
Описание слайда:

История 1969 - Чарльз Гольдфарб создает прототип языка для разметки технической документации GML 1986 определен стандарт SGML (Standard Generalized Markup Language) 1989 - Тим Бернерс-Ли разработал систему разметки гипертекстовых документов HTML 1993 - разработан стандарт HTML 1.2 1994 - создан консорциум W3 1997 - разработаны стандарты HTML 3.2 и HTML 4.0 1995 - разработан стандарт HTML 2.0

№ слайда 6 Терминология Элемент - это конструкция языка HTML предписывающая способ интер
Описание слайда:

Терминология Элемент - это конструкция языка HTML предписывающая способ интерпретации помещенных внутри нее данных Элементы могут вкладываться один в другой подобно матрешкам

№ слайда 7 Терминология - это конструкция языка HTML предписывающая способ интерпретации
Описание слайда:

Терминология - это конструкция языка HTML предписывающая способ интерпретации помещенных внутри нее данных Элементы могут вкладываться один в другой подобно матрешкам Элемент

№ слайда 8 Терминология - это конструкция языка HTML предписывающая способ интерпретации
Описание слайда:

Терминология - это конструкция языка HTML предписывающая способ интерпретации помещенных внутри нее данных Элементы могут вкладываться один в другой подобно матрешкам Элемент

№ слайда 9 Терминология - это конструкция языка HTML предписывающая способ интерпретации
Описание слайда:

Терминология - это конструкция языка HTML предписывающая способ интерпретации помещенных внутри нее данных Элементы могут вкладываться один в другой подобно матрешкам Элемент

№ слайда 10 Терминология - это конструкция языка HTML предписывающая способ интерпретации
Описание слайда:

Терминология - это конструкция языка HTML предписывающая способ интерпретации помещенных внутри нее данных Элементы могут вкладываться один в другой подобно матрешкам Элемент

№ слайда 11 Терминология - это конструкция языка HTML предписывающая способ интерпретации
Описание слайда:

Терминология - это конструкция языка HTML предписывающая способ интерпретации помещенных внутри нее данных Элементы могут вкладываться один в другой подобно матрешкам Элемент

№ слайда 12 Терминология - это конструкция языка HTML предписывающая способ интерпретации
Описание слайда:

Терминология - это конструкция языка HTML предписывающая способ интерпретации помещенных внутри нее данных Элементы могут вкладываться один в другой подобно матрешкам Элемент

№ слайда 13 Терминология - это конструкция языка HTML предписывающая способ интерпретации
Описание слайда:

Терминология - это конструкция языка HTML предписывающая способ интерпретации помещенных внутри нее данных Элементы могут вкладываться один в другой подобно матрешкам Элемент

№ слайда 14 Терминология - это конструкция языка HTML предписывающая способ интерпретации
Описание слайда:

Терминология - это конструкция языка HTML предписывающая способ интерпретации помещенных внутри нее данных Элементы могут вкладываться один в другой подобно матрешкам Элемент

№ слайда 15 Терминология - это конструкция языка HTML предписывающая способ интерпретации
Описание слайда:

Терминология - это конструкция языка HTML предписывающая способ интерпретации помещенных внутри нее данных Элементы могут вкладываться один в другой подобно матрешкам Элемент

№ слайда 16 Терминология - это конструкция языка HTML предписывающая способ интерпретации
Описание слайда:

Терминология - это конструкция языка HTML предписывающая способ интерпретации помещенных внутри нее данных Элементы могут вкладываться один в другой подобно матрешкам Элемент

№ слайда 17 Терминология - это конструкция языка HTML предписывающая способ интерпретации
Описание слайда:

Терминология - это конструкция языка HTML предписывающая способ интерпретации помещенных внутри нее данных Элементы могут вкладываться один в другой подобно матрешкам Элемент

№ слайда 18 Терминология - это конструкция языка HTML предписывающая способ интерпретации
Описание слайда:

Терминология - это конструкция языка HTML предписывающая способ интерпретации помещенных внутри нее данных Элементы могут вкладываться один в другой подобно матрешкам Элемент

№ слайда 19 Терминология - это конструкция языка HTML предписывающая способ интерпретации
Описание слайда:

Терминология - это конструкция языка HTML предписывающая способ интерпретации помещенных внутри нее данных Элементы могут вкладываться один в другой подобно матрешкам Элемент

№ слайда 20 Терминология - это конструкция языка HTML предписывающая способ интерпретации
Описание слайда:

Терминология - это конструкция языка HTML предписывающая способ интерпретации помещенных внутри нее данных Элементы могут вкладываться один в другой подобно матрешкам Элемент

№ слайда 21 Тег - единица разметки, стартовый или конечный маркер элемента. Запись старто
Описание слайда:

Тег - единица разметки, стартовый или конечный маркер элемента. Запись стартового тега в общем виде: <тег> ИНТЕРГРАД Запись конечного тега в общем виде: </тег> Теги определяют границы действия элементов.

№ слайда 22 ИНТЕРГРАД
Описание слайда:

ИНТЕРГРАД

№ слайда 23 Атрибут - параметр или свойство элемента. Запись стартового тега с атрибутом
Описание слайда:

Атрибут - параметр или свойство элемента. Запись стартового тега с атрибутом в общем виде: <тег имяАтрибута="значение"> Все атрибуты записываются внутри стартового тега. Запись атрибута в общем виде: имяАтрибута="значение" Атрибуты внутри стартового тега разделяются пробелами.

№ слайда 24 Наиболее распространенные атрибуты align-выравнивание width - ширина в пиксел
Описание слайда:

Наиболее распространенные атрибуты align-выравнивание width - ширина в пикселах или процентах от ширины окна браузера height - высота в пикселах или процентах от ширины окна браузера color - Указывает цвет в формате RGB или стандартный цвет.

№ слайда 25 HTML-документ - текстовый документ содержимое которого размечено при помощи э
Описание слайда:

HTML-документ - текстовый документ содержимое которого размечено при помощи элементов языка HTML. Такие документы обычно имеют расширение HTM, HTML. HTML-код - совокупность всех элементов языка HTML использованных для разметки документа.

№ слайда 26 Вложенность элементов
Описание слайда:

Вложенность элементов

№ слайда 27 Гиперссылка - объект интерпретируемого документа служащий указателем на друго
Описание слайда:

Гиперссылка - объект интерпретируемого документа служащий указателем на другой элемент, документ или файл. Терминология

№ слайда 28 URL – (Universal Resource Locator) универсальный указатель ресурса Например:
Описание слайда:

URL – (Universal Resource Locator) универсальный указатель ресурса Например: http://mu-mu.ru/gerasim.htm Здесь: Запись URL в общем виде: протокол://имяСервера.имяДомена/путь

№ слайда 29 HTML - документ   Структура гипертекстового документа Заголовок Первый абзац
Описание слайда:

HTML - документ <HTML> </HTML> Структура гипертекстового документа <TITLE>Заголовок</TITLE> Первый абзац документа <IMG SRC=“PIC1.GIF”> ……… Последний абзац документа заголовок

№ слайда 30 Заголовок   Первый абзац документа  Последний абзац документа   HTML - доку
Описание слайда:

<HTML> <HEAD> <TITLE>Заголовок</TITLE> </HEAD> <BODY> Первый абзац документа <IMG SRC=“PIC1.GIF”> Последний абзац документа </BODY> </HTML> HTML - документ Программа-браузер Управляющая часть Окно просмотра интерпретированного HTML-документа Заголовок окна Строка адреса ресурса (URL) Взаимодействие документа и браузера

№ слайда 31 Программа-браузер HTML - документ   Заголовок Первый абзац документа  ……… Пос
Описание слайда:

Программа-браузер HTML - документ <HTML> </HTML> <TITLE>Заголовок</TITLE> Первый абзац документа <IMG SRC=“PIC1.GIF”> ……… Последний абзац документа URL: http://mu-mu.ru/gerasim.htm

№ слайда 32 Программа-браузер HTML - документ   Заголовок Первый абзац документа  ……… Пос
Описание слайда:

Программа-браузер HTML - документ <HTML> </HTML> <TITLE>Заголовок</TITLE> Первый абзац документа <IMG SRC=“PIC1.GIF”> ……… Последний абзац документа URL: http://mu-mu.ru/gerasim.htm

№ слайда 33 Программа-браузер HTML - документ   Заголовок Первый абзац документа  ……… Пос
Описание слайда:

Программа-браузер HTML - документ <HTML> </HTML> <TITLE>Заголовок</TITLE> Первый абзац документа <IMG SRC=“PIC1.GIF”> ……… Последний абзац документа URL: http://mu-mu.ru/gerasim.htm

№ слайда 34 Программа-браузер HTML - документ   Заголовок Первый абзац документа  ……… Пос
Описание слайда:

Программа-браузер HTML - документ <HTML> </HTML> <TITLE>Заголовок</TITLE> Первый абзац документа <IMG SRC=“PIC1.GIF”> ……… Последний абзац документа URL: http://mu-mu.ru/gerasim.htm

№ слайда 35 Программа-браузер HTML - документ   Заголовок Первый абзац документа  ……… Пос
Описание слайда:

Программа-браузер HTML - документ <HTML> </HTML> <TITLE>Заголовок</TITLE> Первый абзац документа <IMG SRC=“PIC1.GIF”> ……… Последний абзац документа URL: http://mu-mu.ru/gerasim.htm

№ слайда 36 Программа-браузер HTML - документ   Заголовок Первый абзац документа  ……… Пос
Описание слайда:

Программа-браузер HTML - документ <HTML> </HTML> <TITLE>Заголовок</TITLE> Первый абзац документа <IMG SRC=“PIC1.GIF”> ……… Последний абзац документа http://mu-mu.ru/gerasim.htm ДОКУМЕНТ НАЙДЕН… ЖДИТЕ.

№ слайда 37 Программа-браузер HTML - документ   Заголовок Первый абзац документа  ……… Пос
Описание слайда:

Программа-браузер HTML - документ <HTML> </HTML> <TITLE>Заголовок</TITLE> Первый абзац документа <IMG SRC=“PIC1.GIF”> ……… Последний абзац документа http://mu-mu.ru/gerasim.htm НАЙДЕНО НАЧАЛО HTML-КОДА

№ слайда 38 Программа-браузер HTML - документ   Заголовок Первый абзац документа  ……… Пос
Описание слайда:

Программа-браузер HTML - документ <HTML> </HTML> <TITLE>Заголовок</TITLE> Первый абзац документа <IMG SRC=“PIC1.GIF”> ……… Последний абзац документа http://mu-mu.ru/gerasim.htm НАЧАТО ИНТЕРПРЕТИРОВАНИЕ ГОЛОВЫ

№ слайда 39 Программа-браузер HTML - документ   Заголовок Первый абзац документа  ……… Пос
Описание слайда:

Программа-браузер HTML - документ <HTML> </HTML> <TITLE>Заголовок</TITLE> Первый абзац документа <IMG SRC=“PIC1.GIF”> ……… Последний абзац документа http://mu-mu.ru/gerasim.htm ИНТЕРПРЕТАЦИЯ ЗАГОЛОВКА Заголовок

№ слайда 40 Программа-браузер HTML - документ   Заголовок Первый абзац документа  ……… Пос
Описание слайда:

Программа-браузер HTML - документ <HTML> </HTML> <TITLE>Заголовок</TITLE> Первый абзац документа <IMG SRC=“PIC1.GIF”> ……… Последний абзац документа http://mu-mu.ru/gerasim.htm ГОЛОВА ПРОИНТЕРПРЕТИРОВАНА Заголовок

№ слайда 41 Программа-браузер HTML - документ   Заголовок Первый абзац документа  ……… Пос
Описание слайда:

Программа-браузер HTML - документ <HTML> </HTML> <TITLE>Заголовок</TITLE> Первый абзац документа <IMG SRC=“PIC1.GIF”> ……… Последний абзац документа http://mu-mu.ru/gerasim.htm Заголовок НАЧАТО ИНТЕРПРЕТИРОВАНИЕ ЧАСТИ ДОКУМЕНТА ОТОБРАЖАЕМОЙ В ОКНЕ БРАУЗЕРА

№ слайда 42 Программа-браузер HTML - документ   Заголовок Первый абзац документа  ……… Пос
Описание слайда:

Программа-браузер HTML - документ <HTML> </HTML> <TITLE>Заголовок</TITLE> Первый абзац документа <IMG SRC=“PIC1.GIF”> ……… Последний абзац документа http://mu-mu.ru/gerasim.htm Заголовок ИНТЕРПРЕТИРУЕТСЯ ТЕКСТ Первый абзац документа

№ слайда 43 Программа-браузер HTML - документ   Заголовок Первый абзац документа  ……… Пос
Описание слайда:

Программа-браузер HTML - документ <HTML> </HTML> <TITLE>Заголовок</TITLE> Первый абзац документа <IMG SRC=“PIC1.GIF”> ……… Последний абзац документа http://mu-mu.ru/gerasim.htm Заголовок ИНТЕРПРЕТИРУЕТСЯ КАРТИНКА Первый абзац документа

№ слайда 44 Программа-браузер HTML - документ   Заголовок Первый абзац документа  ……… Пос
Описание слайда:

Программа-браузер HTML - документ <HTML> </HTML> <TITLE>Заголовок</TITLE> Первый абзац документа <IMG SRC=“PIC1.GIF”> ……… Последний абзац документа http://mu-mu.ru/gerasim.htm Заголовок Первый абзац документа ИНТЕРПРЕТИРУЕТСЯ …ТЕКСТ ……… Последний абзац документа

№ слайда 45 Программа-браузер HTML - документ   Заголовок Первый абзац документа  ……… Пос
Описание слайда:

Программа-браузер HTML - документ <HTML> </HTML> <TITLE>Заголовок</TITLE> Первый абзац документа <IMG SRC=“PIC1.GIF”> ……… Последний абзац документа http://mu-mu.ru/gerasim.htm Заголовок Первый абзац документа ……… Последний абзац документа ЗАКОНЧЕНО ИНТЕРПРЕТИРОВАНИЕ ЧАСТИ ДОКУМЕНТА ОТОБРАЖАЕМОЙ В ОКНЕ БРАУЗЕРА

№ слайда 46 Программа-браузер HTML - документ   Заголовок Первый абзац документа  ……… Пос
Описание слайда:

Программа-браузер HTML - документ <HTML> </HTML> <TITLE>Заголовок</TITLE> Первый абзац документа <IMG SRC=“PIC1.GIF”> ……… Последний абзац документа http://mu-mu.ru/gerasim.htm Заголовок Первый абзац документа ……… Последний абзац документа ДОСТИГНУТА ГРАНИЦА HTML- ДОКУМЕНТА СТРОК ДЛЯ ИНТЕРПРЕТАЦИИ БОЛЬШЕ НЕТ

№ слайда 47 Основные элементы HTML Разметка текста Создание списков Создание таблиц Графи
Описание слайда:

Основные элементы HTML Разметка текста Создание списков Создание таблиц Графика Гиперссылки Основные элементы HTML можно разделить по их назначению на следующие группы:

№ слайда 48 Разметка текста Примеры логической разметки Примеры визуальной разметки
Описание слайда:

Разметка текста Примеры логической разметки Примеры визуальной разметки

№ слайда 49 Заголовки Заголовок Пример записи для форматирования:
Описание слайда:

Заголовки <H1>Заголовок</H1> Пример записи для форматирования:

№ слайда 50 Вставка картинки  Запись элемента в общем виде:  Пример: Использование атрибу
Описание слайда:

Вставка картинки <IMG SRC=“ИмяФайла”> Запись элемента в общем виде: <IMG SRC=“leo1.gif”> Пример: Использование атрибута align:

№ слайда 51 Организация гиперссылки Текст ссылки Запись элемента в общем виде: Пример: Вн
Описание слайда:

Организация гиперссылки <А HREF=“Адрес”>Текст ссылки</A> Запись элемента в общем виде: Пример: Внешний вид документа с сылкой: <А HREF=“http://www.aport.ru”>Поисковая система Аппорт</A> Поисковая система Аппорт


Подайте заявку сейчас на любой интересующий Вас курс переподготовки, чтобы получить диплом со скидкой 50% уже осенью 2017 года.


Выберите специальность, которую Вы хотите получить:

Обучение проходит дистанционно на сайте проекта "Инфоурок".
По итогам обучения слушателям выдаются печатные дипломы установленного образца.

ПЕРЕЙТИ В КАТАЛОГ КУРСОВ

Автор
Дата добавления 04.02.2016
Раздел Информатика
Подраздел Презентации
Просмотров181
Номер материала ДВ-413906
Получить свидетельство о публикации
Похожие материалы

Включите уведомления прямо сейчас и мы сразу сообщим Вам о важных новостях. Не волнуйтесь, мы будем отправлять только самое главное.
Специальное предложение
Вверх