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

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

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

ВНИМАНИЕ: Скидка действует ТОЛЬКО сейчас!

(Лицензия на осуществление образовательной деятельности № 5201 выдана ООО "Инфоурок")

ИнфоурокИнформатикаПрезентацииПрезентация. Основы языка разметки гипертекста HTML. Часть 2.

Презентация. Основы языка разметки гипертекста HTML. Часть 2.

библиотека
материалов
Основы языка гипертекстовой разметки документов HTML (Форматирование текста,...
HTML (Hyper Text Markup Language) «Язык гипертекстовой разметки» «Многомерны...
Парный тэг (Контейнер) 	< … > форматируемый  текстовый фрагмент открывающий т...
Структура Web - страницы «Голова» Web- страницы «Тело» Web- страницы   Имя с...
 Файл –> Сохранить как … Простейшая Web - страница Блокнот Браузер Primer1.html
Для того, чтобы задать Цвет необходимо указать его название или 16-ричный ко...
Атрибуты тэга  Фоновоеизображение … Цветфона …  (… ) Цвет текста …  Цветссыл...
 Фон Web - страницы
Оформление заголовка Заголовки:  текст заголовка , 	 N от 6 до 1 Заголовок п...
Горизонтальная линия на Web-странице Тэг  - выпуклая (объёмная) горизонтальн...
Оформление абзаца  текст абзаца  абзац с выравниванием Перед абзацем автомат...
Форматирование шрифта  увеличение обычного размера шрифта на одну единицу  у...
Форматирование шрифта Строка 1 Строка 2  Строка 3 	Строка 4 Строка 5  Раз ст...
Форматирование шрифта  управление фрагментом текста Атрибуты шрифта: Face (г...

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

1 слайд Основы языка гипертекстовой разметки документов HTML (Форматирование текста,
Описание слайда:

Основы языка гипертекстовой разметки документов HTML (Форматирование текста, оформление страницы) Автор: Пилишкина Надежда Васильевна

2 слайд HTML (Hyper Text Markup Language) «Язык гипертекстовой разметки» «Многомерны
Описание слайда:

HTML (Hyper Text Markup Language) «Язык гипертекстовой разметки» «Многомерный» текстовый документ, в котором установлены смысловые связи между его различными фрагментами Гипертекст- Web-страница - Документ или информационный ресурс Всемирной паутины, доступ к которому осуществляется с помощью веб-браузера. Эта разметка служит для задания формы представления информации, содержащейся в документе. Браузер – Программа просмотра HTML – документов, отображает их в виде Web –страницы, содержание страницы представляется на экране в том виде , которое задаётся тэгами.

3 слайд Парный тэг (Контейнер) 	&lt; … &gt; форматируемый  текстовый фрагмент открывающий т
Описание слайда:

Парный тэг (Контейнер) < … > форматируемый </… > текстовый фрагмент открывающий тэг закрывающий тэг Параметры форматирования определяются атрибутами тегов: <тэг атрибут=“значение”>форматируемый текстовый фрагмент </тэг> Тэги Одиночный тэг (Команда) < … > Код Web-страницы состоит из особых слов – тегов, заключенных в угловые скобки <>. В обычный текстовый документ вставляются управляющие команды (тэги), определяющие вид Web- страницы при её просмотре в браузере (форматирование абзацев, вид шрифта, ссылки на внешние файлы, другие web-страницы или части той же web-страницы)

4 слайд Структура Web - страницы «Голова» Web- страницы «Тело» Web- страницы   Имя с
Описание слайда:

Структура Web - страницы «Голова» Web- страницы «Тело» Web- страницы <html> <head> <title>Имя страницы</title> </head> <body> </body> </html> <html></html> начало и конец страницы <head> </head> описание страницы, информация, предназначенная для поисковых машин <title></title> имя, оглавление страницы, всегда помещается внутри<head><title></title></head> <body></body> содержание страницы, информация, которая будет отображаться в окне браузера

5 слайд  Файл –&gt; Сохранить как … Простейшая Web - страница Блокнот Браузер Primer1.html
Описание слайда:

Файл –> Сохранить как … Простейшая Web - страница Блокнот Браузер Primer1.html

6 слайд Для того, чтобы задать Цвет необходимо указать его название или 16-ричный ко
Описание слайда:

Для того, чтобы задать Цвет необходимо указать его название или 16-ричный код в виде RRGGBB (#FFFFFF – белый, #000000 - чёрный). Цвет на Web - странице

7 слайд Атрибуты тэга  Фоновоеизображение … Цветфона …  (… ) Цвет текста …  Цветссыл
Описание слайда:

Атрибуты тэга <Body> Фоновоеизображение <bodyBACKGROUND=имя файла>…</body> Цветфона <bodyBGCOLOR=цвет>… </body> (<bodyBGCOLOR=“#FF0000”>… </body>) Цвет текста <bodyTEXT=цвет>… </body> Цветссылки <bodyLINK=цвет>… </body> Цветпройденной ссылки <bodyVLINK=цвет>… </body> Цветактивной ссылки <bodyALINK=цвет>… </body> Ширина полейWeb-страницы слева и справа <bodyleftmargin=значение в пикселях></body> Ширина полейWeb-страницы сверху и снизу <bodytopmargin=значение в пикселях></body>

8 слайд  Фон Web - страницы
Описание слайда:

Фон Web - страницы <body background=1.jpg> <body bgcolor=pink>

9 слайд Оформление заголовка Заголовки:  текст заголовка , 	 N от 6 до 1 Заголовок п
Описание слайда:

Оформление заголовка Заголовки: <hN> текст заголовка </hN>, N от 6 до 1 <h1>Заголовок первого уровня</h1> <h2>Заголовок второго уровня</h2> <h3>Заголовок третьего уровня</h3> <h4>Заголовок четвёртого уровня</h4> <h5>Заголовок пятого уровня</h5> <h6>Заголовок шестого уровня</h6> Атрибут заголовка - выравнивание align=значение (left, center, right, justify) <hN align=“center”>заголовок выровнен по центру</hN>

10 слайд Горизонтальная линия на Web-странице Тэг  - выпуклая (объёмная) горизонтальн
Описание слайда:

Горизонтальная линия на Web-странице Тэг <h> - выпуклая (объёмная) горизонтальная линия. Тэг не требует закрывающего тэга. <hr noshade> -линия без тени, <hr color=цвет> <hr size=толщина> <hr width=ширина в пикселях или %> <h1 align=center>Заголовок1 </h1> <hr> <h2 align=center>Заголовок2 </h2> <hr color=red> <h3 align=center>Заголовок3 </h3> <hr color=#FF0000 size=8 width=100>

11 слайд Оформление абзаца  текст абзаца  абзац с выравниванием Перед абзацем автомат
Описание слайда:

Оформление абзаца <P> текст абзаца </P> <P align=“…”>абзац с выравниванием</P> Перед абзацем автоматически добавляется небольшой отступ <P align=“left”> абзац с выравниванием по левому краю</P> <P align=“center”> абзац с выравниванием по центру</P> <P align=“right”>абзац с выравниванием по правому краю</P> <P align=“justify”> абзац с выравниванием по ширине</P>

12 слайд Форматирование шрифта  увеличение обычного размера шрифта на одну единицу  у
Описание слайда:

Форматирование шрифта <Big> увеличение обычного размера шрифта на одну единицу</Big> <Small> уменьшение обычного размера шрифта на одну единицу</Small> <B>полужирноеначертание</B> <i>курсивноеначертание</i> <B><i>полужирныйкурсив</i></B> <U>подчёркнутыйтекст</U> <SUB>верхний индекс</SUB> <SUP>нижний индекс</SUP> <tt>пишущая машинка</tt> <i>курсивноеначертание</i> <DEL>Зачеркнутый текст</DEL>

13 слайд Форматирование шрифта Строка 1 Строка 2  Строка 3 	Строка 4 Строка 5  Раз ст
Описание слайда:

Форматирование шрифта Строка 1 Строка 2 <br> Строка 3 Строка 4 <br>Строка 5 <Pre> Раз ступенька Два ступенька Будет Л е с е н к а </Pre> <BR> перевод на новую строку <Pre> Этот текст будет выглядеть так как он набран</Pre>

14 слайд Форматирование шрифта  управление фрагментом текста Атрибуты шрифта: Face (г
Описание слайда:

Форматирование шрифта <Font> управление фрагментом текста</Font> Атрибуты шрифта: Face (гарнитура), Size (размер 1…7 или +2, -1 и т.д.), Color (цвет) <Font Face=Arial Size=6 Color=red> фрагмент1</Font> <Font Face=Courier Size=+2 Color=#FF0000> фрагмент2 </Font> Courier Arial

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

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

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

Курс повышения квалификации «Табличный процессор MS Excel в профессиональной деятельности учителя математики»
Курс повышения квалификации «Современные информационные технологии и их использование в работе преподавателей. Системы автоматизированного проектирования одежды и организация технологического процесса»
Курс повышения квалификации «Внедрение системы компьютерной математики в процесс обучения математике в старших классах в рамках реализации ФГОС»
Курс профессиональной переподготовки «Информатика: теория и методика преподавания в образовательной организации»
Курс повышения квалификации «Облачные технологии в образовании»
Курс «1С: Предприятие 7.7»
Курс повышения квалификации «Развитие информационно-коммуникационных компетенций учителя в процессе внедрения ФГОС: работа в Московской электронной школе»
Курс профессиональной переподготовки «Информационные технологии в профессиональной деятельности: теория и методика преподавания в образовательной организации»
Курс повышения квалификации «Специфика преподавания информатики в начальных классах с учетом ФГОС НОО»
Курс повышения квалификации «Введение в программирование на языке С (СИ)»
Курс профессиональной переподготовки «Управление в сфере информационных технологий в образовательной организации»
Курс профессиональной переподготовки «Математика и информатика: теория и методика преподавания в образовательной организации»
Курс повышения квалификации «Современные тенденции цифровизации образования»
Курс повышения квалификации «Современные языки программирования интегрированной оболочки Microsoft Visual Studio C# NET., C++. NET, VB.NET. с использованием структурного и объектно-ориентированного методов разработки корпоративных систем»
Курс повышение квалификации «Применение интерактивных образовательных платформ на примере платформы Moodle»

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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