Тема урока: «Язык разметки гипертекста HTML»
Цель: познакомить учеников с языком разметки гипертекста – HTML.
Задачи:
Сформулировать основные принципы создания WEB-страниц;
познакомить учеников с основными командами оформления текста; продемонстрировать использование этих команд на конкретных примерах оформления WEB-страниц;
формировать навыки и умения создания простейших WEB-страниц;
развивать логику, умение анализировать, сравнивать, делать выводы, высказывать свою мысль;
воспитывать аккуратность, внимательность, вежливость и дисциплинированность, бережное отношение к своему здоровью.
Тип урока: усвоение новых знаний.
HTML
Язык
гипертекстовой
разметки
HTML
HTML (Hyper Text Markup Language) – стандартный
язык для создания Web-страниц
Web-страница – документ, который можно открыть и
посмотреть с помощью программы просмотра –
браузера.
Web-сайт – совокупность Web-страниц.
HTML имеет свои команды, которые называются
тегами.
Теги
Тег - элемент HTML, представляющий
из себя текст, заключенный в
угловые скобки <>.
Обычно используются два тега -
открывающий и закрывающий.
Заголовок web-
страницы
Название страницы
Содержимое
страницы
Стандартный текст страницы
Моя страничка
Эта страничка обо мне
Текст страницы изначально пишется в
программе «Блокнот». Затем его надо
правильно сохранить!
Получившаяся страница
Теперь, если
мы откроем
данный файл
в браузере,
то увидим
следующее:
Форматирование страницы
Пока наша страница не очень красива и
красочна. Изменим ее, добавив более
крупный шрифт, красивый фон и пару
картинок
Размер шрифта
Размер шрифта задается тэгами от
( самый крупный) до ( самый
мелкий).
Заголовок страницы целесообразно
выделить самым крупным шрифтом:
Моя страничка
Выравнивание
Принято, чтобы заголовок на странице
находился по центру, для этого
применяется выравнивание.
Выравнивание осуществляется с
помощью атрибута align, которому
присваивают определенное значение:
«right»выравнивание по правой границе,
«center» выравнивание по центру.
Размер шрифта и выравнивание
Эта страничка обо мне
Шрифт
Тэг «FONT» задает параметры
форматирования шрифта текста. Его
атрибуты:COLOR цвет шрифта;
Изменение цвета текста
Моя страничка
Горизонтальная линия
Чтобы отделить заголовок от остального
текста, можно использовать
горизонтальную линию.
Тэг линии
.
Этот тэг одиночный он не требует
закрывающего тэга.
Заголовок страницы
Эта страничка обо мне
Абзацы
Чтобы разделить текст на абзацы,
можно использовать теги
.
При просмотре абзацы отделяются друг
от друга интервалами.
Для каждого абзаца можно задать
свой тип выравнивания, свой цвет и
размер шрифта.
Текст страницы
Моя страничка
Эта страничка обо мне
На этом сайте Вы сможете найти информацию
обо мне, о том, чем я занимаюсь на работе и в свободное
время.
Здесь вы увидите фотографии меня и моих
друзей, моих родных и близких людей.
Вставка изображений
Чтобы сайт был визуально
привлекательным, на нем можно
разместить изображения.
На webстраницах могут размещаться
файлы трех форматов GIF, JPG, PNG.
На титульном листе логично разместить
фотографию того, кому посвящен этот
сайт.
Вставка изображений
Вставка изображения производится с
помощью тэга
![]()
с атрибутом SRC,
который указывает на место хранения
файла на компьютере.
![]()
Например:
Фон слайда
Для изменения фона можно
воспользоваться атрибутом тэга
background, который
указывает на место хранения файла
фонового рисунка на компьютере.
.
Чтобы фон при прокрутке текста не
двигался зафиксируем его с помощью
атрибута bgproperties="fixed"