Выдаём удостоверения и дипломы установленного образца

Получите 5% кэшбэк!

Запишитесь на один из 793 курсов и получите 5% кэшбэк стоимости курса на карту

Выбрать курс
Инфоурок Информатика ПрезентацииПрезентация по информатике на тему " Основы - HTML"

Презентация по информатике на тему " Основы - HTML"

Скачать материал
библиотека
материалов
Основы HTML и CSS Введение и основные понятия

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

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

Основы HTML и CSS Введение и основные понятия

2 слайд История 1986 ISO-8879 SGML 1991 CERN HTML 1994 Подготовка HTML 2.0 Консорциум
Описание слайда:

История 1986 ISO-8879 SGML 1991 CERN HTML 1994 Подготовка HTML 2.0 Консорциум W3 (W3C) www.W3.org март 1995 начало работы над HTML 3 + CSS январь 1997 HTML 3.2 декабрь 1997 HTML 4.0 + CSS 2.0 24 декабря 1999 HTML 4.01 2000 XHTML 1.0 2010 год HTML 5.0 22 января 2008 года W3C официально объявил "HTML 5 - в разработке"

3 слайд Основные понятия Web-сайт Web-сервер Web-адрес (домен) Web-страница ...
Описание слайда:

Основные понятия Web-сайт Web-сервер Web-адрес (домен) Web-страница ...

4 слайд Простая HTML страница   	 		Пример HTML страницы 	 	 		Мой первый HTML-докуме
Описание слайда:

Простая HTML страница <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Пример HTML страницы</title> </head> <body> <h1>Мой первый HTML-документ</h1> <hr> <p>Скоро мы узнаем, что означают эти странные знаки.</p> </body> </html> тег

5 слайд Структура HTML документа   	 		Здесь размещается служебная информация. 	Польз
Описание слайда:

Структура HTML документа <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional // EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> Здесь размещается служебная информация. Пользователь ее не видит. </head> <body> Здесь размещается содержание документа. Именно это видит пользователь. </body> </html> Начало документа Конец документа Начало заголовка Конец заголовка Начало тела документа Конец тела документа Определение типа документа

6 слайд Заголовок документа  	  		 Заголовок документа  	 	 		...Содержание документа
Описание слайда:

Заголовок документа <html> <head> <meta charset="utf-8"> <title> Заголовок документа </title> </head> <body> ...Содержание документа... </body> </html>

7 слайд Тело документа  	 		...Служебная информация... 	 	 		Мой первый HTML документ
Описание слайда:

Тело документа <html> <head> ...Служебная информация... </head> <body> <h1>Мой первый HTML документ</h1> <hr> <!-- горизонтальная линия --> <p>Второй абзац. Для форматирования текста используют разные элементы языка HTML.</p>   <!–- абзац --> <img src="images/girl.png" width="189" height="255"> </body> </html> Комментарий

8 слайд Заголовки Заголовок 1 Заголовок 2 Заголовок 3 Заголовок 4 Заголовок 5 Заголов
Описание слайда:

Заголовки <h1>Заголовок 1</h1> <h2>Заголовок 2</h2> <h3>Заголовок 3</h3> <h4>Заголовок 4</h4> <h5>Заголовок 5</h5> <h6>Заголовок 6</h6>

9 слайд Горизонтальная линия Горизонтальная линия   Браузеры, которые интерпретируют
Описание слайда:

Горизонтальная линия <h1>Горизонтальная линия</h1> <hr> <p> Браузеры, которые интерпретируют мягкие переносы, должны обеспечивать следующую семантику: если строка прекращается в месте мягкого переноса…

10 слайд Абзац  	Браузеры, которые интерпретируют мягкие переносы, должны обеспечивать
Описание слайда:

Абзац <P> Браузеры, которые интерпретируют мягкие переносы, должны обеспечивать следующую семантику: если строка прекращается в месте мягкого переноса, в конце первой строки должен отображаться символ переноса. </P> <P> Если строка не прерывается в месте мягкого переноса, символ переноса отображаться не должен. При выполнении таких операций как поиск и сортировка мягкие переносы всегда должны игнорироваться.

11 слайд Улучшаем страницу  Мой дядя самых честных правил, Когда не в шутку занемог, О
Описание слайда:

Улучшаем страницу <p> Мой дядя самых честных правил, Когда не в шутку занемог, Он уважать себя заставил И лучше выдумать не мог. </p> <p>Мой дядя самых честных правил, <p>Когда не в шутку занемог, <p>Он уважать себя заставил <p>И лучше выдумать не мог.

12 слайд Принудительный разрыв строки Мой дядя самых честных правил, Когда не в шутку
Описание слайда:

Принудительный разрыв строки <p>Мой дядя самых честных правил, <br>Когда не в шутку занемог, <br>Он уважать себя заставил <br>И лучше выдумать не мог.

13 слайд Окончательный вид документа   	 		Мой первый документ 	 	 		Мой первый HTML-д
Описание слайда:

Окончательный вид документа <!-- Форматирование кода с отступами --> <html> <head> <title>Мой первый документ</title> </head> <body> <h1>Мой первый HTML-документ</h1> <hr> <h2>Евгений Онегин</h2> <p>А.С.Пушкин (отрывок) <p> Мой дядя самых честных правил, <br>Когда не в шутку занемог, <br>Он уважать себя заставил <br>И лучше выдумать не мог. <hr> </body> </html>

14 слайд Атрибуты элементов  Атрибут Атрибут Тег Имя атрибута Значение атрибута Атрибут
Описание слайда:

Атрибуты элементов <hr align="right" size="3" width="450" > Атрибут Атрибут Тег Имя атрибута Значение атрибута Атрибут

15 слайд Используем атрибуты  Выровнять по центру  Выровнять по правому краю  Выровнят
Описание слайда:

Используем атрибуты <h1 align="center"> Выровнять по центру <p align="right"> Выровнять по правому краю <p align="justify"> Выровнять по ширине <h2 align="left"> Выровнять по левому краю <hr size="3"> Толщина разделительной линии <hr noshade> Разделительная линия без тени <hr align="right" width="450"> Ширина в пикселях <hr size="3" width="50%" align="center">

16 слайд Авторское форматирование  Время – 	начинаю 		про Ленина рассказ. Но не потому
Описание слайда:

Авторское форматирование <pre> Время – начинаю про Ленина рассказ. Но не потому, что горя нету более, время потому, что резкая тоска стала ясною осознанною болью. </pre>

17 слайд Элементы DIV и SPAN  	Первый div 	Второй div 	Третий div 	Первый span 	Второй
Описание слайда:

Элементы DIV и SPAN <div id="main"> <div class="one">Первый div</div> <div class="one">Второй div</div> <div class="one">Третий div</div> <span class="two">Первый span</span> <span class="two">Второй span</span> <span class="two">Третий span</span> </div>

18 слайд Коротко о цвете Диапазон: 00 - FF (0 - 255) #00FF00 – green (зеленый) #FF0000
Описание слайда:

Коротко о цвете Диапазон: 00 - FF (0 - 255) #00FF00 – green (зеленый) #FF0000 – red (красный) #0000FF – blue (синий) #FFFFFF – white (белый) #000000 – black (черный) #FFFF00 – yellow (жёлтый) #FFD700 - gold (золотой) #FFCC00 - tangerine (мандариновый) #E49B0F - gamboge (гуммигут) #FDE910 – lemon (лимонный) Безопасная палитра цветов: 00,33,66,99, CC,FF (216 сочетаний). Шестнадцатеричная система счисления: 0,1,2,3,4,5,6,7,8,9,A,B,C,D,E,F

19 слайд Раскрашиваем страницу  	 		Раскрашиваем страницу 	 	 		Этот текст синего цвет
Описание слайда:

Раскрашиваем страницу <html> <head> <title>Раскрашиваем страницу</title> </head> <body bgcolor="silver" text="#0000FF"> <p>Этот текст синего цвета, <font color="red"> а этот - красного.</font> <hr color="green">Горизонтальная линия тоже может быть разноцветная. </body> </html>

20 слайд Непосредственное форматирование текста  - курсив   - полужирный   - подчеркну
Описание слайда:

Непосредственное форматирование текста <i> - курсив </i> <b> - полужирный </b> <u> - подчеркнутый </u> <strike> - перечеркнутый </strike> <tt> - моноширинный </tt> <big> - увеличить шрифт </big> <small> - уменьшить шрифт </small> <sup> - надиндекс </sup> <sub> - подиндекс </sub>

21 слайд Специальные символы &amp;nbsp;	&amp;#160;	Неразбиваемый пробел	 &amp;quot;	&amp;#034;	Прямая
Описание слайда:

Специальные символы &nbsp; &#160; Неразбиваемый пробел &quot; &#034; Прямая кавычка " &amp; &#038; Амперсанд & &lt; &#060; Знак "меньше" < &gt; &#062; Знак "больше" > &copy; &#169; Копирайт © &reg; &#174; Зарегистрировано ® &trade; &#153; Торговая марка ™

  • Если Вы считаете, что материал нарушает авторские права либо по каким-то другим причинам должен быть удален с сайта, Вы можете оставить жалобу на материал.
    Пожаловаться на материал
Курс повышения квалификации
Курс профессиональной переподготовки
Учитель математики и информатики
Курс профессиональной переподготовки
Учитель информатики
Скачать материал
Найдите материал к любому уроку,
указав свой предмет (категорию), класс, учебник и тему:
также Вы можете выбрать тип материала:
Общая информация
Учебник: «Информатика (базовый уровень)», Семакин И.Г., Хеннер Е.К., Шеина Т.Ю.
Тема: § 13. Инструменты для разработки web-сайтов

Номер материала: ДБ-1253816

Скачать материал

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

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

Оставьте свой комментарий

Авторизуйтесь, чтобы задавать вопросы.