Базовые теги

Краткое описание приемов работы

Атрибуты тега

Открывающие теги могут содержать атрибуты, то есть дополнительную информацию о свойствах отображаемого на экране элемента. Атрибуты записываются внутри открывающего тега после его имени в виде отдельного ключевого слова или ключевого слова, знака "=" и параметра (значения атрибута). Порядок следования атрибутов в теге не важен. Атрибут действует от открывающего тега, в котором он задан, до закрывающего или только внутри тега, если тег не имеет парного.

Например, тег <HR size = 5>, задает прорисовку горизонтальной линии толщиной 5 пиксел.

Комментарии

Как любой язык, HTML позволяет вставлять в тело документа комментарии, которые сохраняются при передаче документа по сети, но не отображаются браузером. Комментарии могут встречаться в документе где угодно и в любом количестве.

Синтаксис комментария:

<!-- Это комментарий -->

Базовые теги

В таблице 1 приводится краткое описание базовых тегов, с использованием которых вы можете создавать простые HTML-документы.

Таблица 1 Список базовых тегов

Стартовый Завершающий Описание
<HTML> </HTML> Обозначение HTML-документа
<HEAD> </HEAD> Заголовочная часть документа
<TITLE> </TITLE> Заголовок документа
<BODY> </BODY> Тело документа
<H1> </H1> Заголовок абзаца первого уровня. Всего существует шесть уровней заголовков абзаца от <H1> до <H6>
<P> </P> Абзац
<PRE> </PRE> Форматированный текст
<BR>   Перевод строки
</BLOCKQUOTE> <BLOCKQUOTE> Цитата

1.4. Признак HTML-документа <HTML>

Когда браузер получает документ, он определяет, как документ должен быть интерпретирован. Самый первый тег, который встречается в документе, должен быть тегом <HTML>. Данный тег сообщает браузеру, что ваш документ написан с использованием языка HTML.

1.5. Заголовочная часть документа <HEAD>

Тег заголовочной части документа должен быть использован сразу после тега <HTML>. Данный тег представляет собой общее описание документа.

1.6. Заголовок документа <TITLE>

Большинство браузеров отображают содержимое тега <TITLE> в заголовке окна, содержащего документ. Заголовок, ограниченный тегами <TITLE> и </TITLE>, размещается внутри <HEAD>-тегов.

1.7. Тело документа <BODY>

Тело документа должно находиться между тегами <BODY> и </BODY>. Это та часть документа, которая отображается как смысловая информация вашего документа. Тег <BODY> не только идентифицирует начало тела документа, но и позволяет установить некоторые атрибуты текста.

Цвет фона и цвет шрифта. В предыдущей работе вы никак не задавали, ни цвет фона документа, ни цвет шрифта, которым отображался текст. Тем не менее, и фон, и шрифт не были бесцветными. Вероятно, вы видели черный шрифт на белом фоне, все зависит от настроек вашего браузера. Когда в программе на HTML цвета явно не заданы, браузер использует свои установки по умолчанию. Если вы хотите явно задать цвета вашего документа, то это можно сделать при помощи атрибутов bgcolor (цвет фона) и text (цвет шрифта) в теге <BODY>. Например, <HTML> <HEAD>.... </HEAD> <BODY bgcolor=aqua text=black>.... </BODY> </HTML> означает, что в документе заданы черные символы (black) на бирюзовом фоне (aqua).

Атрибуты цветов, заданные в теге <BODY> действуют до парного тега </BODY>, то есть, до конца документа. При этом цвет фона может задаваться только один раз, а цвет шрифта можно менять внутри документа много раз при помощи тега <FONT>...</FONT>. Установка цвета в этом теге выполняется при помощи атрибута color. Например, <HTML> <HEAD>.... </HEAD> <BODY bgcolor=aqua text=black>.... <FONT color=maroon> <!дальше цвет шрифта будет коричневым (maroon)>.... </FONT> <!а теперь опять черным>.... </BODY> </HTML> позволяет изменить цвет фрагмента текста, расположенного между тегами <FONT> </FONT>.

1.8. Заголовки <Hn>

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

<Hn>Текст заголовка</Hn>

Здесь n обозначает одну из цифр 1-6, задающую уровень заголовка. Заголовки разных уровней выделяются браузером при показе HTML-документа размером шрифта и жирностью.

1.9. Абзацы <P>

В отличие от большинства текстовых процессоров, в HTML-документе обычно игнорируются символы возврата каретки (которые вставляются при нажатии клавиши Enter). Физический разрыв абзаца может находиться в любом месте исходного текста документа. Однако браузер разделяет абзацы только при наличии тега <P>. Абзац задается тегами <P> и </P>, между которыми помещается текст. Фактически работа тега <P> сводится к выводу перед текстовым фрагментом пустой строки. Если вы не разделите абзацы тегом <P>, ваш документ будет выглядеть как один большой абзац.

Тег <P> имеет атрибут align, c помощью которого можно запрограммировать вывод текста абзаца с выравниванием по левому краю (<P align = left>), центру (<P ALIGN=center>) или правому краю (<P ALIGN=right>). По умолчанию текст выравнивается по левому краю.

1.10. Сохранение авторского форматирования текста <PRE>

В предыдущей работе вы убедились, что браузеры игнорируют множественные пробелы и символы конца строки при показе текста документа на экране. Из этого правила, однако, есть исключение. Тег <PRE>...</PRE> заставляет браузер выводить текст на экран так, как он записан в исходном тексте HTML-документа со всеми пробелами и концами строк.

1.11. Разрыв строки <BR>

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

.....

г. Пенза, <BR>

Технологический институт, <BR>

каф. АИСТ <BR>

Обратите внимание, что тег <BR> непарный.

1.12. Цитаты <BLOCKQUOTE>

Название книги, газетной статьи, фильма или песни можно выделить при помощи цитат. Цитаты лучше выделять из основного текста при помощи тега <BLOCKQUOTE>...</BLOCKQUOTE>. Браузер отображает цитату с большим, чем у обычного текста, левым и правым отступом от края страницы.


Понравилась статья? Добавь ее в закладку (CTRL+D) и не забудь поделиться с друзьями:  



double arrow
Сейчас читают про: