Upload
marina-litvinovich
View
816
Download
5
Embed Size (px)
DESCRIPTION
Основы языка HTML для интернет-журналистов
Citation preview
Основы языка HTML
Тэги• Теги - служебные символы, представляющие собой команды HTML, которые
указывает броузеру, как следует отображать Web-страницу.
• Теги начинаются со знака < , за которым следует ключевое слово, и заканчивается знаком > .
Примеры:
< HTML >
< B O D Y >
< T A B L E >
< I M G >
Тэги
• Теги делятся на две категории. Начальный тег, который содержит имя тега, открывает действие по представлению гипертекста, а конечный тег, который содержит тоже самое имя тега с предшествующим ему символом / ("косая черта" или "слэш"), - отменяет его.
• Теги не чувствительны к регистру символов, то есть тег < TABLE > может быть записан и как < table >.
Основные тэги
< html >< /html >
• Тег HTML указывает начало и конец HTML документа.
Основные тэги
< head >< /head >
• Тег HEAD (заголовок HTML-документа) содержит информацию, относящуюся к документу в целом.
Основные тэги
< body >< /body >
• Тег BODY охватывает ту часть HTML-документа (текст, изображения и элементы формирования), которая будет видна пользователю.
Основные тэги
<title >< /title >
• Тег TITLE устанавливает заголовок HTML-документа, выводимый в строке заголовка окна броузера.
Структура HTML документа
<HTML> - Начало документа
<HEAD>ЗАГОЛОВОК ДОКУМЕНТА</HEAD>
<BODY>ТЕЛО ДОКУМЕНТА</BODY>
</HTML> - Конец документа
Основные тэги
< body bgcolor=? >
• Атрибут BGCOLOR устанавливает цвет фона HTML-документа. Цвет может быть указан с помощью с помощью названия или шестнадцатиричного кода.
Основные тэги
< body text=? >
• Атрибут TEXT устанавливает цвет для всего текста HTML-документа. Цвет может быть указан с помощью с помощью названия или шестнадцатиричного кода.
< body link=? >
• Атрибут LINK устанавливает цвет всем ссылкам HTML-документа, которые еще не были активизированы. Цвет может быть указан с помощью с помощью названия или шестнадцатиричного кода.
Тэги элементов текста
< h1 >< /h1 >
• Тег H1 определяет заголовок первого уровня (самые крупные буквы в заголовке). Всего имеется шесть уровней заголовков.
< h6 >< /h6 >
• Тег H6 определяет заголовок шестого уровня (самые мелкие буквы в заголовке). Всего имеется шесть уровней заголовков.
Пример: код<html> <head> <title> Отображение заголовков</title> </head> <body> <hl> Заголовок первого уровня </h1> <h2> Заголовок второго уровня </h2> <h3> Заголовок третьего уровня </h3> <h4> Заголовок четвертого уровня </h4> <h5> Заголовок пятого уровня </h5> <h6> Заголовок шестого уровня </h6> <р>0бычный текст</р></body></html>
Пример: вид
Тэги элементов текста
< b >< /b >
• Тег B устанавливает отображение текста в жирном начертании.
< i >< /i >
• Тег I устанавливает отображение текста курсивом.
Тэги элементов текста
< em >< /em >
• Тег EM устанавливает отображение текста жирным курсивом.
< strong >< /strong >
• Тег STRONG устанавливает отображене текста в жирном начертании.
Тэги элементов текста
< font size=? >< /font >
• Атрибут SIZE тега FONT устанавливает относительный размер шрифта. Список возможных значений состоит из положительных и отрицательных чисел от 0 до 7.
< font color=? >< /font >
• Атрибут COLOR тега FONT устанавливает цвет текста. Цвет может быть указан с помощью с помощью названия или шестнадцатиричного кода.
Тэги элементов текста
< p >< /p >
• Тег P устанавливает начало и конец абзаца.
< p align=? >
• Атрибут ALIGN тега P устанавливает режим выравнивания текста: влево (LEFT), вправо (RIGHT) или по центру (CENTER).
Тэги элементов текста
< br >
• Тег BR устанавливает перенос строки (даже если текст продолжается за тегом).
< blockquote >< /blockquote >
• Тег BLOCKQUOTE устанавливает отступы слева и справа от текста. Кроме этого тег устанавливает разрыв абзаца до и после указанного текста.
Тэги элементов текста< ol >< /ol >
• Тег OL ("ordered list" - упорядоченный список) устанавливает режим последовательной нумерации элементов, размещенных внутри списка.
< ul >< /ul >
• Тег UL ("unordered list" - неупорядоченный список) устанавливает режим отображения текста в виде маркированного списка.
< li >< /li >
• Тег LI устанавливает режим отображения текста в виде пункта списка. Такой список может быть неупорядоченным, упорядоченным или маркированным.
Пример: в коде
Список структурированный<ul><li> Собака </li><li> Кошка </li><li> Мышь </li></ul>
Пример: вид
Список структурированный• Собака • Кошка • Мышь
Теги графических элементов< img src="name" >
• Тег IMG устанавливает режим отображения графического файла.
< img src="name" align=? >
• Атрибут ALIGN тега IMG устанавливает режим выравнивания указанного изображения в отведенном ему пространстве. Возможно выравнивание влево (LEFT), вправо (RIGHT), по центру (CENTER), вниз (BOTTOM), вверх (TOP), посередине (MIDDLE).
< img src="name" border=? >
• Атрибут BORDER тега IMG устанавливает режим отображения рамки вокруг указанного изображения. Рисунок с гиперссылкой по умолчанию имеет рамку, цвет которой совпадает с цветом, используемым для гиперссылок.
< img src="name" alt=? >
• Атрибут ALT тега IMG устанавливает режим отображения указанного текста (в качестве альтернативы) в случае, если броузер не может отобразить графический файл.
ПримерКод:Поставьте к себе этот баннер:<img title="Баннер" align=center src="http://87.242.91.21/110324/gazeta/6839/60848.jpg" width=780 height=90>Вид:Поставьте к себе этот баннер:
Теги элементов ссылок < a href="URL" >< /a >
• Тег A устанавливает связь с некоторой точкой внутри того же HTML-документа или с другим URL (гипертествовая ссылка). Атрибут HREF тега A описывает объект, представляющий собой текст или рисунок внутри HTML-документа, либо текст или рисунок во внешнем документе.
< a name="NAME" >< /a >
• Тег A устанавливает связь с некоторой точкой внутри того же HTML-документа или с другим URL (гипертествовая ссылка). Атрибут NAME тега A описывает точку внутри HTML-документа, в которую нужно переместить пользователя.
Пример
Код:Прочитайте <a href="http://www.gazeta.ru/column/rynska/3569689.shtml">этот замечательный</a> текст
Вид:Прочитайте этот замечательный текст
Теги таблиц< table >< /table >
• Тег TABLE устанавливает начало и конец таблицы. Все теги, определяющие структуру таблицы, должны располагаться между тегами TABLE.
< tr >< /tr >
• Тег TR определяет строку таблицы.
< td >< /td >
• Тег TD определяет колонку таблицы. Текст, заключенный между тегами TD ("table data" - табличные данные), отображается внутри одной ячейки.
Текстовые подстановки
< Знак неравенства "меньше" (<) > ; Знак неравенства "больше" (>), & Знак амперсанта (&) " Знак кавычек