Открывающий и закрывающий теги нужны для указания начала и конца элемента. Теги всегда начинаются символом < и заканчиваются символом >. В закрывающем теге перед его именем помещается символ /. Для некоторых типов элементов допускается отсутствие закрывающего тега (например, элемент P, указывающий начало абзаца). Существуют также элементы, не имеющие закрывающего тега, то есть его не просто можно опустить, а он вообще не существует в языке.
Элементы могут содержать параметры, называемые атрибутами. Атрибуты могут иметь определенные значения (по умолчанию или устанавливаемые авторами). Пара атрибут/значение указывается в начальном теге элемента перед символом >, например:
<BODY bgcolor = «#FF0000»>
Каждому атрибуту может быть присвоено значение определенного типа. В приведенном примере указание атрибута bgcolor (имеющего тип %Color) в элементе BODY приведет к тому, что цвет фона страницы станет красным. Значения атрибутов заключаются в кавычки, хотя в определенных случаях кавычки необязательны.
В начальном теге элемента может быть указано любое количество допустимых пар атрибут/значение, разделенных пробелами, например:
<BODY bgcolor = «#FF0000» text = «#0000FF»>
В приведенном примере устанавливаются красный цвет фона страницы и синий цвет основного текста. При установке значений нескольких атрибутов порядок их записи не имеет значения. Важно отметить, что регистр, в котором записываются названия атрибутов, также не имеет значения. Однако для повышения читабельности HTML‑кода названия атрибутов обычно записываются в нижнем регистре (как в приведенных выше и ниже примерах).
Существует любопытная разновидность атрибутов – булевы атрибуты. Для них возможны только два значения: ИСТИНА и ЛОЖЬ. По умолчанию эти атрибуты имеют значение ЛОЖЬ. Чтобы присвоить им истинное значение, достаточно просто указать имя этого атрибута, не присваивая ему никакого значения. Ниже приведен пример, в котором устанавливаются истинные значения двух атрибутов HTML‑элемента INPUT:
<INPUT readonly disabled>
Важным моментом HTML является возможность использования вложенных элементов. Элемент, находящийся внутри другого элемента, называется вложенным. Пример использования вложенных элементов для задания начертания шрифта:
<I>Курсив<B>-Полужирный курсив-</B>Курсив</I>
При обработке приведенного HTML‑кода получится страница, показанная на рис. 1.1 (как и чем обрабатываются HTML‑документы, будет рассказано далее).
Рис. 1.1. Применение вложенных элементов
На приведенном рисунке видно, как действие внешнего (или родительского) элемента I (задание курсива) дополняет действие внутреннего элемента B (задание полужирного начертания шрифта).
При использовании вложенности следует помнить, что вложенные элементы должны закрываться до того, как будут закрыты внешние элементы. Так, следующий пример является неверным:
<I>Неправильное закрытие<B> внутреннего элемента</I>
до закрытия внешнего</B>
Блочные и встроенные элементы
Различают также блочные и встроенные элементы (иногда их называют элементами уровня блока и элементами уровня текста). Основным отличием блочных элементов является форматирование их браузером как обособленной части документа. Блочные элементы задаются парными тегами и могут содержать вложенные блочные или встроенные элементы и, естественно, текст.
Встроенные элементы обычно находятся прямо в тексте и могут иметь содержимое или не иметь его. Примерами встроенных элементов могут служить приведенные ранее элементы B и I, а также элементы перевода строки, изображения и т. д. В отличие от блочных элементов, встроенные элементы могут содержать только текст или вложенные встроенные элементы.
1.3. Просмотр HTML-документа
Сам по себе HTML‑документ практически нечитабелен для обычного пользователя. Для чего же тогда применяется форматирование документа с использованием HTML? Для просмотра HTML‑документов используются специальные программы – браузеры. При открытии HTML‑документа браузер распознает теги и учитывает их при отображении текста. Если по каким‑то причинам (например, при ошибке в записи тега) тег не распознается браузером, то он игнорируется.
Существует большое количество программ, позволяющих просматривать HTML‑документы. Это такие распространенные приложения, как Internet Explorer, Opera, Firefox, Netscape Navigator.
Ниже приведен пример простого HTML‑документа (назначение используемых элементов будет рассмотрено далее в книге) (пример 1.1).
Пример 1.1. HTML-документ
<HTML>
<TITLE>Простой HTML-документ</TITLE>
<BODY>
<H1>Заголовок</H1>
Текст страницы
</BODY>
</HTML>
Этот HTML‑документ отображается браузером Internet Explorer так, как показано на рис. 1.2.
Рис. 1.2. Отображение HTML-документа
1.4. Универсальный идентификатор ресурса URI
Чтобы полностью понимать, как происходит взаимодействие HTML‑документов, переход между страницами и откуда вообще компьютер пользователя получает данные при работе с сетью, нужно рассмотреть, как и к чему осуществляется доступ при помощи Глобальной сети.
Многие виды ресурсов, размещенных в Интернете, независимо от того, являются ли они HTML‑документами, рисунками или файлами архива, чаще всего представляют собой файлы на жестком диске компьютера (сервера), подключенного к сети. С каждым ресурсом сопоставляется значение, по которому можно однозначно определить его расположение, – универсальный идентификатор ресурса или URI (Universal Resource Identifier). URI широко используются как при самостоятельном доступе пользователя к ресурсу (когда, например, пользователь сам вводит URI в адресной строке браузера), так и при переходе между веб‑страницами. URI также используются в HTML‑документе для указания браузеру, где искать ресурсы (например, рисунки), используемые в самом документе.
Примечание
В литературе также часто применяется обозначение URL. Следует отметить, что URI является более общим понятием, включающим в себя URL: любой URL является универсальным идентификатором ресурса и подчиняется тем же правилам, что и URI.
Идентификатор ресурса URI состоит из трех частей: из наименования механизма доступа к ресурсу, доменного имени компьютера и пути файла ресурса. Для пояснения сказанного можно рассмотреть пример:
http://www.somesite.com/info/examples/ex_1.html
Здесь можно увидеть, что для доступа к ресурсу, которым в данном случае является HTML‑документ, используется протокол HTTP (Hyper Text Transfer Protocol). Ресурс хранится на компьютере, имеющем доменное имя somesite.com в файле ex_1.html, расположенном в папке /info/examples.
При помощи URI можно также ссылаться на части HTML‑документов, например:
http://www.somesite.com/info/examples/ex_1.html#description
При использовании этого URI можно получить доступ к части HTML‑документа, имеющей имя description (то, как создавать имена для фрагментов HTML‑документов, будет рассмотрено в гл. 5).
URI также позволяют ссылаться на ресурсы в пределах одного компьютера. При этом указывается относительный путь ресурса. Например, чтобы из HTML‑документа, расположенного в папке /info/examples, сослаться на файл /info/files/file1.jpg, достаточно задать URI /files/file1.jpg. В HTML‑документах при помощи подобных ссылок указываются пути рисунков и других объектов, используемых в документах, но непосредственно не хранимых в них.
В общем случае URI считаются нечувствительными к регистру символов. Однако для полной уверенности в правильности интерпретации URI все же обращайте внимание на регистр символов в URI гиперссылок, рисунков и т. д. Это полезно для устранения таких ситуаций, когда, например, при работе сайта на компьютере под Windows все гиперссылки работают, а при помещении сайта на UNIX‑сервер работать отказываются (в UNIX имена файлов чувствительны к регистру).
Глава 2
Структура HTML-документа
В идеальном случае HTML‑документ состоит из трех частей, в которых описывается следующая информация:
• данные о версии используемого HTML;
• заголовок документа;
• тело документа.
Выражение «в идеальном случае» означает то, что один или несколько элементов могут пропускаться: если HTML‑документ содержит хоть какой‑то текст, пусть без информации о версии, без заголовка и без явного указания тела документа, то браузер все равно отобразит информацию, содержащуюся в этом документе, при этом применяя к тексту еще и форматирование. Правда, в этом случае заведомо неизвестно, насколько исказится содержимое документа.
Итак, полноценный (полный, стандартный) HTML‑документ должен содержать все три указанные элемента структуры или хотя бы два последних элемента. Далее приводится пример простейшего HTML‑документа, содержащего все указанные структурные элементы (пример 2.1).
Пример 2.1. Задание структуры HTML-документа
<!DOCTYPE HTML PUBLIC «-//W3C//DTD HTML 4.01//EN»>
