Приложение к лекции 10 Общие понятия об HTML. Основные тэги.

Презентация:



Advertisements
Похожие презентации
Занятие 3 Заголовочные теги, шрифты и абзацы. "Параграфы или Учимся выравнивать текст" АтрибутЗначения атрибута текст центрировать текст текст выровнять.
Advertisements

Создание сайта. 1. Первый документ Мой первый шаг Здравствуйте, это моя первая страница. Добро пожаловать ! :)
Занятие 5 Иллюстрации и гиперссылки. "Как вставлять картинки" - одиночный тег для размещения картинки src=URL" – обязательный атрибут тега URL – ссылка.
Занятие 7 Таблицы и списки. Создание нумерованных и маркированных списков Список всегда располагается между открывающим и закрывающим тегом списка: и.
Основы Web-дизайна Основы Web-дизайна Первые шаги.
Web-сайты и web- страницы. Цели и задачи: 1.Образовательные: 1. Ввести понятие «web-сайт»; 2. Познакомить с HTML; 3. Рассмотреть достоинства языка разметки.
Автор: Пилишкина Надежда Васильевна. HTML (Hyper Text Markup Language) «Язык гипертекстовой разметки» «Многомерный» текстовый документ, в котором установлены.
Форматирование текста на Web- странице. Мой первый шаг Здравствуйте, это моя первая страница. Добро пожаловать! Структура HTML-документа.
Катанов Александр Гребешков Александр. 2 Содержание: 1.Введение………………………………………………………………… Построение: а)Главные тэги……………………………………………………
Язык разметки гипертекста HTML Hyper Text Markup Language.
Форматирование текста на Web-странице Пока наша страница выглядит не слишком привлекательно: мелкий шрифт чёрного цвета на белом фоне. С помощью тэгов.
Мой первый шаг Здравствуйте, это моя первая страница. Добро пожаловать! Структура HTML-документа.
HTML Язык гипертекстовой разметки. Стандартный текст страницы Моя страничка Эта страничка обо мне.
(HyperText Markup Language) – язык гипертекстовой разметки.
HTML. Первые шаги.
Урок по информатике Разработка учителя информатики средней школы 1 г. Приволжска Твельневой Т.А. Создание Web-страницы Цель урока: познакомить учащихся.
Atbalsts vispārējās izglītības pedagogu nodrošināšanai prioritārajos mācību priekšmetos Vien. Nr. 2008/0001/1DP/ /08/IPIA/VIAA/002 HTML dokumenta.
Лекция 1 Основные понятия и определения Гвасалия Дарья Александровна.
Ключевые слова 1.WWW 2.Структура Web-страницыHTML 3.HTML-редактор 4.Цветовые схемы 5.гиперссылка.
был разработан британским учёным Тимом Бернерсом-Ли приблизительно в годах. это язык разметки гипертекста.
Транксрипт:

Приложение к лекции 10 Общие понятия об HTML. Основные тэги.

Всемирная паутина (World Wide Web WWW) состоит из множества связанных между собой электронных документов, представляющих кладезь информационных данных, описанных с помощью специальных технологических правил. Эти правила составляются на языке гипертекстовой разметки HTML (HyperText Markup Language). Можно с уверенностью сказать, что сегодня язык разметки HTML является основой всех размещенных в Интернете электронных документов.

Мой первый шаг Здравствуйте, это моя первая страница. Добро пожаловать! :)

Сохранение созданного файла Файл -> Сохранить Как (File -> Save as) - Дальше вводите имя своего документа, например: index.html (а не просто index; приписочка *.html должна быть обязательно). - Если вы уже сохранили ваш документ, как *.html, то при внесении изменений в этот документ вы можете уже сохранять их через Файл -> Сохранить (File -> Save). Теперь откроем броузер, допустим, Internet Explorer (не закрывайте блокнот, он нам еще пригодится), и откроем в броузере наш документ. Файл - Открыть - кнопка Обзор - Наш документ (index.html) File – Open – Browse – index.html

Первый тэг Этот тэг должен открывать документ. Если есть открывающий тэг, то должен быть и закрывающий:

Второй тэг (перенос текста на другую строку) - не требует закрывающего тэга. - голова документа - тело документа

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

Третий тэг: окрас текста цветом Добро пожаловать! :) Color – параметр (атрибут) для тэга font, он отвечает, в данном случае, за цвет заключенного в контейнер текста. Атрибут color, как и другие атрибуты, не принадлежит только одному тэгу, он может быть присвоен и некоторым другим тэгам.

Пример применения Мой первый шаг Здравствуйте, это моя первая страница. Добро пожаловать! :)

Четвёртый тэг – окрас всего текста. Тэг - многофункционален. - это значит, что весь текст страницы будет синим. Если цвет текста в не задавать, то по умолчанию он будет черным.

Пример применения Мой первый шаг Здравствуйте, это моя первая страница. Добро пожаловать! :)

Пятый тэг – установка цвета фона Цвет фона устанавливается в уже знакомом нам тэге :

Пример применения Мой первый шаг

Обратите внимание: мы одновременно можем прописать в тэге и цвет текста в документе, и цвет фона.

Шестой тэг – выравнивание текста Параграфы вводятся тэгом: С помощью параграфов мы можем центрировать текст: текст

С помощью параграфов мы можем выровнять текст по левому краю: текст По правому краю документа: текст По обоим краям документа: текст

Пример применения Мой первый шаг Здравствуйте, это моя первая страница. Добро пожаловать! :)

Аналог тэга Аналог тэга текст

Пример использования Мой первый шаг Здравствуйте, это моя первая страница. Добро пожаловать! :) Я совсем недавно начал(а) знакомиться с виртуальной жизнью, но мне по давней традиции тоже захотелось создать свою домашнюю страничку для моих новых виртуальных друзей и знакомых, чтобы они могли посмотреть мои фотографии, почитать обо мне, черкнуть пару строчек в мою гостевую книгу. А может и просто случайный посетитель вдруг захочет познакомится со мной, и у меня появться еще один виртуальный друг? :)

Седьмой тэг – размер шрифта Существуют шесть уровней заголовков: текст

Пример использования Мой первый шаг Здравствуйте, это моя первая страница. Добро пожаловать! :) Я совсем недавно начал(а) знакомиться с виртуальной жизнью, но мне по давней традиции тоже захотелось создать свою домашнюю страничку для моих новых виртуальных друзей и знакомых, чтобы они могли посмотреть мои фотографии, почитать обо мне, черкнуть пару строчек в мою гостевую книгу. А может и просто случайный посетитель вдруг захочет познакомится со мной, и у меня появится еще один виртуальный друг? :)

Заголовки предназначены для выделения небольшой части текста (строки, фразы). Но, если вы хотите выделить большой фрагмент текста, то заголовки для этого использовать нельзя. Для этого предназначен атрибут size тэга, который устанавливает желаемый размер шрифта: текст текст текст текст текст текст текст

Пример использования Мой первый шаг Здравствуйте, это моя первая страница. Добро пожаловать! :) Я совсем недавно начал(а) знакомиться с виртуальной жизнью, но мне по давней традиции тоже захотелось создать свою домашнюю страничку для моих новых виртуальных друзей и знакомых, чтобы они могли посмотреть мои фотографии, почитать обо мне, черкнуть пару строчек в мою гостевую книгу. А может и просто случайный посетитель вдруг захочет познакомится со мной, и у меня появится еще один виртуальный друг? :)

Восьмой тэг – установка стиля текста Полужирный текст Наклонный текст (курсив) моноширинный шрифт текст (куча пробелов) текст текст (куча пробелов) текст текст (куча пробелов) текст К одному фрагменту текста может применяться сразу несколько тэгов: текст

Подчеркнутый текст вводится при помощи тэга : Подчеркнутый текст Тэги и представляют текст перечеркнутым шрифтом, можете использовать какой вам угодно из них, принципиальной разницы между ними нет: Перечеркнутый

Тэг представляется крупным шрифтом, а малым шрифтом относительно основного текста: Малый Нормальный текст Большой

Тэги Sup и Sub - определяют верхний и нижний индексы. Sup - верхний, Sub – нижний. Где они могут пригодиться? Ну, например, при написании какой-нибудь формулы - H2O (все, что мы выносим со школьной скамьи:). Верхний индекс sup Нижний индекс sub

Девятый тэг – запись наименования шрифта текст (шрифт Arial) Times; Times New Roman; Arial; Helvetica; Courier; Verdana; Tahoma; Cosmic Sans; Garamond

Десятый тэг – вставка графического объекта Если картинка лежит на уровень выше, а документ находится в поддиректории, то ссылка на неё будет такой: Если картинка лежит на другом сайте, то путь прописывается полностью:

Пример использования Мой первый шаг Здравствуйте, это моя первая страница. Добро пожаловать! :) Я совсем недавно начал(а) знакомиться с виртуальной жизнью, но мне по давней традиции тоже захотелось создать свою домашнюю страничку для моих новых виртуальных друзей и знакомых, чтобы они могли посмотреть мои фотографии, почитать обо мне, черкнуть пару строчек в мою гостевую книгу. А может и просто случайный посетитель вдруг захочет познакомится со мной, и у меня появится еще один виртуальный друг? :)