Что такое findslide.org?

FindSlide.org - это сайт презентаций, докладов, шаблонов в формате PowerPoint.

Для правообладателей

Обратная связь

Email: Нажмите что бы посмотреть 

Яндекс.Метрика

Презентация на тему HTML Учебник для чайничков

Содержание

Что означают эти буквы?HTMLHyper Text Markup LanguageHTMLЯзык гипертекстовой разметки
HTMLУчебник для «чайничков» Что означают эти буквы?HTMLHyper Text Markup LanguageHTMLЯзык гипертекстовой разметки Не раз загружали мы, WEB-страничку…Именно язык гипертекстовой разметки HTML, ответственен за появление Что такое HTML- файл?HTMLHTML – файл это обычный текст, написанный например Что такое тэги?Тэг - это имя (специальное слово), написанное на английском языке, Создание личных страничек Обычно сайт создается на локальном компьютере, а затем, когда СтруктураЧтобы наши вещи не терялись, мы их раскладываем по полочкам. Чтобы точно В каких средах работаем?Чтобы написать HTML- код необходимо открыть приложение Блокнот (текстовый Браузер - программа для просмотра Web-страниц. В нашем компьютерном классе установлена программа Структура HTML - страницыHTMLHTML – кодНачало страницыКонец страницы Заголовочная частьHTMLИнформатика HTMLТекст заключенный между тэгами Информатика, отобразился в строке Имени документа Основная частьМы приветствуем Вас! тэги заголовка первого уровня на Вот результат сохраненной Web – странички и просмотренной в браузереHTML Основная частьМы приветствуем Вас!В путь тэги заголовка второго уровня Мы приветствуем Вас!Приходите к нам и вы научитесь делать САЙТ HTMLВот результат сохраненной Web – странички и просмотренной в браузере Другие ТЭГИ … - добавление переноса строки - полужирный - курсив Другие ТЭГИ … - добавление Другие ТЭГИ … - добавление движущегося Другие ТЭГИ … - добавление движущегося Другие ТЭГИ … - добавление движущегося Другие ТЭГИ … добавление движущегося ПриветHTML з а п о м н и HTMLЕсли вы внесли изменения в Сочетания клавиш помогут вам работать быстрееCtrl + A – выделить всёCtrl + Замечания!!!Можно писать в любом реестре, но придерживаться выбранного вами стиля.=« » Задание.Создай 2 WEB-странички. Используй все полученные знания. Материалы для работы находятся в папке MATERIAL HTMLАвтор учебника:Котлярова Виктория Юрьевна, учитель информатики и ИКТ, 1.кв.кат, МБОУ СОШ №1 им. Н.К.Крупской,Нижний Тагил
Слайды презентации

Слайд 2 Что означают эти буквы?
HTML
Hyper Text Markup Language
HTML
Язык гипертекстовой

Что означают эти буквы?HTMLHyper Text Markup LanguageHTMLЯзык гипертекстовой разметки

разметки

Слайд 3 Не раз загружали мы, WEB-страничку…
Именно язык гипертекстовой разметки

Не раз загружали мы, WEB-страничку…Именно язык гипертекстовой разметки HTML, ответственен за

HTML, ответственен за появление многих чудесных WEB-страничек, WEB-сайтов, наполненных

текстами, картинками, звуками, анимацией, видеоклипами, ссылками…

Именно он определяет:
содержание,
внешний вид,
направленность странички.

Слайд 4 Что такое HTML- файл?
HTML
HTML – файл это

Что такое HTML- файл?HTMLHTML – файл это обычный текст, написанный

обычный текст, написанный например в программе Блокнот, но который

содержит тэги.

Не верится?
И не верь, лучше всё ты сам проверь!

Каждый слайд содержит информацию о том, как создать или, что должно У ТЕБЯ получиться.
Будь внимателен!
После сверки своей работы с примерами, реши продолжать тебе путь или вернуться…

Слайд 5 Что такое тэги?
Тэг - это имя (специальное слово),

Что такое тэги?Тэг - это имя (специальное слово), написанное на английском

написанное на английском языке, заключенное в угловые скобки.
Например: ,




тэги

Парные

Непарные



открывающий

закрывающий



Слайд 6 Создание личных страничек
Обычно сайт создается на локальном

Создание личных страничек Обычно сайт создается на локальном компьютере, а затем,

компьютере, а затем, когда он готов для публикации, копируется

на Web-сервер
Создать Моих документах Папку под названием My_Site_Petrov

HTML

Слайд 7 Структура
Чтобы наши вещи не терялись, мы их раскладываем

СтруктураЧтобы наши вещи не терялись, мы их раскладываем по полочкам. Чтобы

по полочкам. Чтобы точно знать где графика, звуки, тексты

мы будем придерживаться следующей структуры.

Слайд 8
В каких средах работаем?
Чтобы написать HTML- код необходимо

В каких средах работаем?Чтобы написать HTML- код необходимо открыть приложение Блокнот

открыть приложение Блокнот (текстовый редактор)
Пуск, Программы, Стандартные,

Блокнот

Сохранить HTML- код так, чтобы страницу можно было просмотреть в Web-браузере:
Файл, Сохранить как (появится диалоговое окно)
Где? В вашей папке сайта My Site
Имя файла? «index.html» Сохранить

HTML

Слайд 9 Браузер
- программа для просмотра Web-страниц.
В нашем

Браузер - программа для просмотра Web-страниц. В нашем компьютерном классе установлена

компьютерном классе установлена программа Internet Explorer. Она преобразует код

в то, что мы видим на web-странице (текст, изображения, таблицы,…)

Слайд 10 Структура HTML - страницы







HTML
HTML – код




Начало страницы

Конец страницы

Структура HTML - страницыHTMLHTML – кодНачало страницыКонец страницы

Слайд 11 Заголовочная часть


HTML

Информатика

Заголовочная частьHTMLИнформатика

Слайд 12 HTML
Текст заключенный между тэгами Информатика, отобразился в строке

HTMLТекст заключенный между тэгами Информатика, отобразился в строке Имени документа

Имени документа

Слайд 13 Основная часть

Мы приветствуем Вас!

тэги

Основная частьМы приветствуем Вас! тэги заголовка первого уровня на

заголовка первого уровня на

Web – странице,
в основной части страницы.


HTML

Слайд 14 Вот результат сохраненной Web – странички и просмотренной

Вот результат сохраненной Web – странички и просмотренной в браузереHTML

в браузере
HTML

Слайд 15 Основная часть

Мы приветствуем Вас!
В путь


Основная частьМы приветствуем Вас!В путь тэги заголовка второго уровня на

тэги заголовка второго уровня на

Web – странице,
отличие в размере шрифта, чем больше уровень, тем меньше размер


HTML

Слайд 16
Мы приветствуем Вас!
Приходите к нам и вы научитесь

Мы приветствуем Вас!Приходите к нам и вы научитесь делать САЙТ

делать САЙТ

тэги для размещения

абзаца на странице


Основная часть

HTML


Слайд 17 HTML
Вот результат сохраненной Web – странички и просмотренной

HTMLВот результат сохраненной Web – странички и просмотренной в браузере

в браузере

Слайд 18 Другие ТЭГИ …

- добавление переноса строки
-

Другие ТЭГИ … - добавление переноса строки - полужирный -

полужирный
- курсив
-

центрирование
абзаца

HTML

Атрибут
тэга

Значение
атрибута

Слайд 19 Другие ТЭГИ …
- добавление

Другие ТЭГИ … - добавление

изображения


- добавление фонового изображения

HTML

Имя.расширение

Имя.расширение

Имя папки
нахождения изображения

Слайд 20 Другие ТЭГИ …
- добавление движущегося

Другие ТЭГИ … - добавление движущегося

текста
Но вы должны указать атрибуты, то есть описать поведение движения текста
Behavior (поведение)
scroll (прокрутка)
alternate (чередование)
slide (скольжение)
ПО умолчанию устанавливается scroll

HTML


Слайд 21 Другие ТЭГИ …
- добавление движущегося

Другие ТЭГИ … - добавление движущегося

текста
Но вы должны указать атрибуты, то есть описать направление движения текста
Direction (направление)
left (ПО умолчанию) (влево)
right (вправо)
up (вверх)
down (вниз)

HTML


Слайд 22 Другие ТЭГИ …
- добавление движущегося

Другие ТЭГИ … - добавление движущегося

текста
Но вы должны указать атрибуты, то есть описать цвет фона движущегося текста
Bgcolor (цвет фона движущейся строки)
red
сyan
Любой цвет

HTML


Слайд 23 Другие ТЭГИ …
добавление

Другие ТЭГИ … добавление движущегося

движущегося

текста
Но вы должны указать атрибуты, то есть описать цикл прокрутки движущегося текста
Loop (цикл) сyan
infinite (бесконечный)
«2»
«3»
«4»

HTML


Слайд 24 Привет
HTML

ПриветHTML

Слайд 25 з а п о м н и
HTML
Если

з а п о м н и HTMLЕсли вы внесли изменения

вы внесли изменения в код, необходимо сохранить лист с

кодом и обновить web-страницу, данная кнопка поможет вам в этом.

Слайд 26 Сочетания клавиш помогут вам работать быстрее
Ctrl + A –

Сочетания клавиш помогут вам работать быстрееCtrl + A – выделить всёCtrl

выделить всё
Ctrl + S – сохранить
Ctrl + V –

вставить
Alt + Tab – смена активного документа

Слайд 27 Замечания!!!
Можно писать в любом реестре, но придерживаться выбранного

Замечания!!!Можно писать в любом реестре, но придерживаться выбранного вами стиля.=« »

вами стиля.
=« » - этот набор знаков

указывает на путь до нужного объекта (картинки, документа)
После каждой строки тэгов нажми клавишу «ENTER»

HTML

Слайд 28 Задание.
Создай 2 WEB-странички. Используй все полученные знания. Материалы

Задание.Создай 2 WEB-странички. Используй все полученные знания. Материалы для работы находятся в папке MATERIAL

для работы находятся в папке MATERIAL

  • Имя файла: html-uchebnik-dlya-chaynichkov.pptx
  • Количество просмотров: 151
  • Количество скачиваний: 1
- Предыдущая Рельеф Саратовской области
Следующая - Новая геометрия Николая Лобачевского

Похожие презентации

Сложность алгоритмов Сложность алгоритмов 203
Презентация к уроку Решение задач № 2 (3 класс) Презентация к уроку Решение задач № 2 (3 класс) 213
Безопасность в сети Интернет Безопасность в сети Интернет 113
Рисование в Paint Рисование в Paint 135
Использование ИКТ на музыкальных занятиях в ДОУ занимательные факты по информатике Использование ИКТ на музыкальных занятиях в ДОУ занимательные факты по информатике 139
HTML Язык описания Web-страниц HTML Язык описания Web-страниц 217
Интернет-зависимость - проблема современного общества Интернет-зависимость - проблема современного общества 104
Титульная страница Титульная страница 87
Вставка музыки в презентацию Вставка музыки в презентацию 113
Арифметика Арифметика 119
Компьютерные вирусы. Антивирусные программы Компьютерные вирусы. Антивирусные программы 116
Создание базы данных Создание базы данных 136
СОВРЕМЕННЫЕ ЭЛЕКТРОННЫЕ ОБРАЗОВАТЕЛЬНЫЕ РЕСУРСЫ СОВРЕМЕННЫЕ ЭЛЕКТРОННЫЕ ОБРАЗОВАТЕЛЬНЫЕ РЕСУРСЫ 126
Нейтрализация инсайдерских угроз функционированию программных компонентов на основе двухконтурной архитектуры безопасности Нейтрализация инсайдерских угроз функционированию программных компонентов на основе двухконтурной архитектуры безопасности 125
Модели. Виды модели Модели. Виды модели 161
Assembly language Assembly language 124
Технология мультимедиа Технология мультимедиа 132
Устройство персонального компьютера Устройство персонального компьютера 119
Презентация Римские цифры презентация к уроку по информатике (2 класс) по теме Презентация Римские цифры презентация к уроку по информатике (2 класс) по теме 141
инструменты графического редактора paint 5 класс инструменты графического редактора paint 5 класс 145
Java. Стандартная библиотека классов. Generics. Java. Стандартная библиотека классов. Generics. 131
Проектная деятельность на уроках информатики Проектная деятельность на уроках информатики 120
Желтоқсан тәуелсіздік - шежіресі (6 сынып тәрбие сағаты) Желтоқсан тәуелсіздік - шежіресі (6 сынып тәрбие сағаты) 352
Лекция № 15. Поиск и индексация Лекция № 15. Поиск и индексация 119
Оптоволоконные сети Оптоволоконные сети 129
Основы программирования на языке QBasic Основы программирования на языке QBasic 141
Прогнозирование долговечности соединений выполненных точечной сваркой Прогнозирование долговечности соединений выполненных точечной сваркой 114
Коммуникационные технологии Коммуникационные технологии 163
Презентация по информатике на тему Принципы обработки информации компьютером Презентация по информатике на тему Принципы обработки информации компьютером 164
Файловая система Файловая система 133