959150
столько раз учителя, ученики и родители
посетили сайт «Инфоурок»
за прошедшие 24 часа
+Добавить материал
и получить бесплатное
свидетельство о публикации
в СМИ №ФС77-60625 от 20.01.2015
Дистанционные курсы профессиональной переподготовки и повышения квалификации для педагогов

Дистанционные курсы для педагогов - курсы профессиональной переподготовки от 1.410 руб.;
- курсы повышения квалификации от 430 руб.
Московские документы для аттестации

ВЫБРАТЬ КУРС СО СКИДКОЙ ДО 90%

ВНИМАНИЕ: Скидка действует ТОЛЬКО до конца апреля!

(Лицензия на осуществление образовательной деятельности №038767 выдана ООО "Столичный учебный центр", г.Москва)

ИнфоурокИнформатикаПрезентацииОсновы НТМЛ. Структура HTML - документа.

Основы НТМЛ. Структура HTML - документа.

библиотека
материалов
Основы HTML
HTML (Hyper Text Markup Language) язык разметки гипертекста Web-страницы
Программы для создания HTML – файлов: Редакторы (HTML Wirtel, HTML Assistant,...
Программы для просмотра Web - страниц Microsoft Internet Explorer Netscape Co...
Блокнот (для создания страницы) Internet Explorer (для интерпретации файлов)...
Гипертекст – это текст, содержащий специальные разметочные теги. Теги (tag –...
Пример тега   Типы тегов Парные (влияет на текст с того места, где употреблён...
Структурные теги Теги символов Теги форматирования абзацев Теги оформления сп...
Структура HTML - документа
начинает описание HTML - файла HTML - документ состоит из двух частей: Разд...
Раздел заголовка Начинается тегом  Заканчивается тегом  Mежду данными тегами...
Раздел содержательной части Начинается тегом  Заканчивается тегом  (между кот...
Создать файл в Блокноте (сохраните в файле Пример, указав расширение *. html)...
Создать файл в Блокноте (сохраните в файле Пример, указав расширение *. html)
Теги символов Теги логического форматирования текста Теги физического формати...
Теги логического форматирования текста
Теги физического форматирования текста
используется для отметки аббревиатур, акронимов (акроним – произносимое слов...
Пример использования тега :  МКОУ  «Глядянская средняя общеобразовательная шк...
Пример использования тега :
Тег  позволяет изменить шрифт
Параметры тега  FACE (задаёт название шрифта, которым будет выводится текст)...
Задание цвета на языке HTML Шестнадцатеричные значения (цветовая система бази...
Пример использования параметра Color:  Шрифт размера 6, цвет зелёный   или  Ш...
Примеры использования параметров тега  :  Название шрифта    Шрифт размера 5...
 Тег  используется для указания размера, типа и цвета шрифта по умолчанию
Примеры использования тега  :  Шрифт по умолчанию размера 3 Шрифт размера 2...
Пример использования параметра Color c тегом :  Задание цвета фона
тег «параграф», отделяет абзац друг от друга Тег
Примеры использования тега  :  Выравнивание по левой границе окна  Выравниван...
 Тег  отображение горизонтальной линии
Пример использования тега  :
 Тег  для разметки заголовков (,, , , , )
Вставка пробелов и специальных символов &nbsp &#34 &#177 &#178
СПАСИБО ЗА ВНИМАНИЕ!

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

1 слайд Основы HTML
Описание слайда:

Основы HTML

2 слайд HTML (Hyper Text Markup Language) язык разметки гипертекста Web-страницы
Описание слайда:

HTML (Hyper Text Markup Language) язык разметки гипертекста Web-страницы

3 слайд Программы для создания HTML – файлов: Редакторы (HTML Wirtel, HTML Assistant,
Описание слайда:

Программы для создания HTML – файлов: Редакторы (HTML Wirtel, HTML Assistant, WebEdit, HomeSite, Блокнот и т.д.) Шаблоны Программы-преобразователи

4 слайд Программы для просмотра Web - страниц Microsoft Internet Explorer Netscape Co
Описание слайда:

Программы для просмотра Web - страниц Microsoft Internet Explorer Netscape Communicator The Bat! Opera и т.д.

5 слайд Блокнот (для создания страницы) Internet Explorer (для интерпретации файлов)
Описание слайда:

Блокнот (для создания страницы) Internet Explorer (для интерпретации файлов) Программы для создания HTML – файлов:

6 слайд Гипертекст – это текст, содержащий специальные разметочные теги. Теги (tag –
Описание слайда:

Гипертекст – это текст, содержащий специальные разметочные теги. Теги (tag – ярлык, признак) – инструкции браузера, указывающие способ отображения текста.

7 слайд Пример тега   Типы тегов Парные (влияет на текст с того места, где употреблён
Описание слайда:

Пример тега <HTML> </HTML> Типы тегов Парные (влияет на текст с того места, где употреблён тег, до того места, где указан признак окончания его действия) Непарные

8 слайд Структурные теги Теги символов Теги форматирования абзацев Теги оформления сп
Описание слайда:

Структурные теги Теги символов Теги форматирования абзацев Теги оформления списков данных Теги логического форматирования текста Теги физического форматирования текста Категории тегов

9 слайд Структура HTML - документа
Описание слайда:

Структура HTML - документа

10 слайд начинает описание HTML - файла HTML - документ состоит из двух частей: Разд
Описание слайда:

<HTML> </HTML> начинает описание HTML - файла HTML - документ состоит из двух частей: Раздел заголовка Содержательная часть

11 слайд Раздел заголовка Начинается тегом  Заканчивается тегом  Mежду данными тегами
Описание слайда:

Раздел заголовка Начинается тегом <HEAD> Заканчивается тегом </HEAD> Mежду данными тегами располагается тег <TITLE> </TITLE> (этот тег используется для задания названия документа)

12 слайд Раздел содержательной части Начинается тегом  Заканчивается тегом  (между кот
Описание слайда:

Раздел содержательной части Начинается тегом <BODY> Заканчивается тегом </BODY> (между которыми располагается содержимое HTML - документа)

13 слайд Создать файл в Блокноте (сохраните в файле Пример, указав расширение *. html)
Описание слайда:

Создать файл в Блокноте (сохраните в файле Пример, указав расширение *. html) <HTML> <HEAD> <TITLE>Заголовок HTML – документа </TITLE> </HEAD> <BODY> Это тело HTML – документа. Здесь можно разместить всё, что угодно. </BODY> </HTML>

14 слайд Создать файл в Блокноте (сохраните в файле Пример, указав расширение *. html)
Описание слайда:

Создать файл в Блокноте (сохраните в файле Пример, указав расширение *. html)

15 слайд Теги символов Теги логического форматирования текста Теги физического формати
Описание слайда:

Теги символов Теги логического форматирования текста Теги физического форматирования текста

16 слайд Теги логического форматирования текста
Описание слайда:

Теги логического форматирования текста <CITE> </CITE> <CODE> </CODE> <DEL> </DEL> <DFN> </DFN> <INS> </INS> <EM> </EM> <KBD> </KBD> <SAMP> </SAMP> <STRONG> </STRONG> <VAR> </VAR>

17 слайд Теги физического форматирования текста
Описание слайда:

Теги физического форматирования текста <B> </B> <I> </I> <U> </U> <TT> </TT> <STRIKE> </STRIKE> <S> </S> <BIG> </BIG> <SMALL> </SMALL> <SUB> </SUB> <SUP> </SUP> <FONT> </FONT> <BASEFONT>

18 слайд используется для отметки аббревиатур, акронимов (акроним – произносимое слов
Описание слайда:

<ACRONYM></ACRONYM> используется для отметки аббревиатур, акронимов (акроним – произносимое слово, состоящее из начальных букв словосочетания); используя тег <TITLE> - можно указать «расшифровку» акронима, которая появляется на экране, когда курсор располагается на акрониме.

19 слайд Пример использования тега :  МКОУ  «Глядянская средняя общеобразовательная шк
Описание слайда:

Пример использования тега <ACRONYM>: <ACRONYM TITLE=«Муниципальное казённое общеобразовательное учреждение»> МКОУ </ACRONYM> «Глядянская средняя общеобразовательная школа»

20 слайд Пример использования тега :
Описание слайда:

Пример использования тега <ACRONYM>:

21 слайд Тег  позволяет изменить шрифт
Описание слайда:

Тег <FONT> позволяет изменить шрифт

22 слайд Параметры тега  FACE (задаёт название шрифта, которым будет выводится текст)
Описание слайда:

Параметры тега <FONT> FACE (задаёт название шрифта, которым будет выводится текст) SIZE (задаёт размеры шрифта в условных единицах от 1 до 7) COLOR (устанавливает цвет шрифта, который может задаваться с помощью стандартных имён или набором шестнадцатеричных цифр)

23 слайд Задание цвета на языке HTML Шестнадцатеричные значения (цветовая система бази
Описание слайда:

Задание цвета на языке HTML Шестнадцатеричные значения (цветовая система базируется на трёх основных цветах – красном, зеленом и синем – обозначается RGB) Например: #000000, #0000FF, #FF0000, #FFFFFF Мнемонические обозначения (название цвета) Например: Red, White, Blue, Green

24 слайд Пример использования параметра Color:  Шрифт размера 6, цвет зелёный   или  Ш
Описание слайда:

Пример использования параметра Color: <FONT COLOR=Green> Шрифт размера 6, цвет зелёный </FONT> <BR> или <FONT COLOR=#008000> Шрифт размера 6, цвет зелёный </FONT> <BR>

25 слайд Примеры использования параметров тега  :  Название шрифта    Шрифт размера 5
Описание слайда:

Примеры использования параметров тега <FONT> : <FONT FACE=“ARIAL”> Название шрифта </FONT> <BR> <FONT SIZE=5> Шрифт размера 5 </FONT> <BR> <FONT FACE=“ARIAL” SIZE=+3 COLOR=Green> Шрифт размера 6, цвет зелёный </FONT> <BR>

26 слайд  Тег  используется для указания размера, типа и цвета шрифта по умолчанию
Описание слайда:

Тег <BASEFONT> используется для указания размера, типа и цвета шрифта по умолчанию

27 слайд Примеры использования тега  :  Шрифт по умолчанию размера 3 Шрифт размера 2
Описание слайда:

Примеры использования тега <BASEFONT> : <BASEFONT FACE=“Courier” COLOR=#008080> Шрифт по умолчанию размера 3<BR> <BASEFONT SIZE=2>Шрифт размера 2<BR> <BASEFONT SIZE=4 COLOR=Olive> Шрифт размера 4, цвет оливковый <BR>

28 слайд Пример использования параметра Color c тегом :  Задание цвета фона
Описание слайда:

Пример использования параметра Color c тегом <BODY>: <BODY BGCOLOR=#008080> Задание цвета фона <BR>

29 слайд тег «параграф», отделяет абзац друг от друга Тег
Описание слайда:

тег «параграф», отделяет абзац друг от друга Тег <Р>

30 слайд Примеры использования тега  :  Выравнивание по левой границе окна  Выравниван
Описание слайда:

Примеры использования тега <P> : <P ALIGN=LEFT> Выравнивание по левой границе окна<BR> <P ALIGN=CENTER> Выравнивание по центру окна<BR> <P ALIGN=RIGHT> Выравнивание по правой границе окна<BR> <P ALIGN=JUSTIFY> Выравнивание по ширине окна<BR>

31 слайд  Тег  отображение горизонтальной линии
Описание слайда:

Тег <HR> отображение горизонтальной линии

32 слайд Пример использования тега  :
Описание слайда:

Пример использования тега <HR> : <HR ALIGN=LEFT WIDHT=20 SIZE=30 COLOR=#00FF00>

33 слайд  Тег  для разметки заголовков (,, , , , )
Описание слайда:

Тег <H1> для разметки заголовков (<H1>,<H2>, <H3>, <H4>, <H5>, <H6>)

34 слайд Вставка пробелов и специальных символов &amp;nbsp &amp;#34 &amp;#177 &amp;#178
Описание слайда:

Вставка пробелов и специальных символов &nbsp &#34 &#177 &#178

35 слайд СПАСИБО ЗА ВНИМАНИЕ!
Описание слайда:

СПАСИБО ЗА ВНИМАНИЕ!

Общая информация

Номер материала: ДВ-103836

Вам будут интересны эти курсы:

Курс повышения квалификации «Табличный процессор MS Excel в профессиональной деятельности учителя математики»
Курс повышения квалификации «Информационные технологии в деятельности учителя физики»
Курс повышения квалификации «Методика преподавания информатики в начальных классах»
Курс повышения квалификации «Основы создания интерактивного урока: от презентации до видеоурока»
Курс повышения квалификации «Внедрение системы компьютерной математики в процесс обучения математике в старших классах в рамках реализации ФГОС»
Курс профессиональной переподготовки «Информатика: теория и методика преподавания в образовательной организации»
Курс повышения квалификации «Облачные технологии в образовании»
Курс «Фирменный стиль» (Corel Draw, Photoshop)
Курс «Оператор персонального компьютера»
Курс «1С: Предприятие 7.7»
Курс повышения квалификации «Развитие информационно-коммуникационных компетенций учителя в процессе внедрения ФГОС: работа в Московской электронной школе»
Курс повышения квалификации «Использование компьютерных технологий в процессе обучения в условиях реализации ФГОС»
Курс повышения квалификации «Введение в программирование на языке С (СИ)»
Курс профессиональной переподготовки «Управление в сфере информационных технологий в образовательной организации»
Курс профессиональной переподготовки «Математика и информатика: теория и методика преподавания в образовательной организации»

Благодарность за вклад в развитие крупнейшей онлайн-библиотеки методических разработок для учителей

Опубликуйте минимум 3 материала, чтобы БЕСПЛАТНО получить и скачать данную благодарность

Сертификат о создании сайта

Добавьте минимум пять материалов, чтобы получить сертификат о создании сайта

Грамота за использование ИКТ в работе педагога

Опубликуйте минимум 10 материалов, чтобы БЕСПЛАТНО получить и скачать данную грамоту

Свидетельство о представлении обобщённого педагогического опыта на Всероссийском уровне

Опубликуйте минимум 15 материалов, чтобы БЕСПЛАТНО получить и скачать данное cвидетельство

Грамота за высокий профессионализм, проявленный в процессе создания и развития собственного учительского сайта в рамках проекта "Инфоурок"

Опубликуйте минимум 20 материалов, чтобы БЕСПЛАТНО получить и скачать данную грамоту

Грамота за активное участие в работе над повышением качества образования совместно с проектом "Инфоурок"

Опубликуйте минимум 25 материалов, чтобы БЕСПЛАТНО получить и скачать данную грамоту

Почётная грамота за научно-просветительскую и образовательную деятельность в рамках проекта "Инфоурок"

Опубликуйте минимум 40 материалов, чтобы БЕСПЛАТНО получить и скачать данную почётную грамоту

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