HTML-документ состоит из слов двух типов: служебных слов и собственно текста, выводимого на экран. Служебные слова называются тэгами (tags) и берутся в угловые скобки < >. В литературе тэги называют также дескрипторами и операторами. Тэги бывают двойными, называемые контейнерами (container), и одиночными. Примером контейнера служат тэги, задающие начало HTML-документа: <HTML> и его окончание: </HTML>. Тэг окончания контейнера отличается от тэга его начала наличием символа "/". Текст, находящийся между началом контейнера и его окончанием, является его содержимым.
Примером одиночного тэга служит тэг перевода на новую строку: <BR> (браузерами не обрабатываются символы текстовых редакторов перевода каретки CR и перехода на новую строку LF) .
В HTML-документе в наименованиях тэгов и их параметров, а также в словах, являющимися их значениями, заглавные и строчные буквы не различаются. В дальнейшем будем придерживаться следующего соглашения: наименования тэгов и параметров будут указываться заглавными буквами, а их значения - строчными буквами.
HTML-документ имеет следующую базовую структуру, которая состоит из заголовка HTML-документа и тела HTML-документа:
<HTML>
<HEAD>
. . .
</HEAD>
<BODY>
. . .
</BODY>
</HTML>
В заголовке HTML-документа, который находится внутри тэга-контейнера <HEAD> . . . </HEAD>, помещается информация, которая не выводится в основное поле Web-страницы. Она используется браузером для других целей. Например, с помощью контейнера <TITLE>. . . </TITLE> задается заголовок Web-страницы, помещаемый вверху экрана. Этот заголовок указывается в перечне посещенных страниц и в других местах. Поэтому, если разработчик Web-страницы хочет, чтобы его сайт был востребован, ему необходимо внимательно отнестись к содержимому заголовка Web-страницы.
Данная Web-страница имеет следующий заголовок: Лабораторная работа 1: форматирование текста на Web-странице средствами HTML - Microsoft Internet Explorer
Последние три слова добавляет сам браузер.
В теле HTML-документа, который находится внутри тэга-контейнера <BODY> . . . </BODY>, помещается текст, который будет непосредственно выводится на экран. Примером (№1) простейшего HTML-документа, выводящего на экран традиционное сообщение "Привет, мир!", является следующий текст:
Пример 1
<HTML>
<BODY>
Привет, мир!
</BODY>
</HTML>Оглавление
В этом примере и в дальнейшем при описании HTML-документов будем придерживаться следующего правила - тэги, их параметры и значения будут иметь темно-синий цвет, а исходный текст, который форматируется и выводится на экран будет темно-зеленого цвета.
Щелкнув по кнопке "Пример 1" мы получим на экране результат выполнения этого HTML-документа: сообщение "Привет, мир!" находится в верхнем левом углу экрана, имеет черный цвет и небольшой размер букв (эти параметры заданы по умолчанию) и выглядит непривлекательно. Чтобы сделать его вид более приятным необходимо выполнить форматирование текста, т.е. задать его цвет, размер, выравнивание и другие параметры средствами HTML (см. раздел 2).
Чтобы вернуться назад к данной странице необходимо щелкнуть по стрелке Back (Назад) на панели управления браузера.
Чтобы увидеть исходный текст текущей Web-страницы необходимо на панели управления браузера выбрать View (Вид), а затем Source (Просмотр HTML-кода).
Отметим, что современные браузеры способны понимать и упрощенную структуру документа. Например, HTML-документ, состоящий из одной строки:
Привет, мир!
даст на экране такое же сообщение. Но мы в дальнейшем будем придерживаться полной формы HTML-документа.
Текст может быть разбит на параграфы. Для указания параграфа используется контейнер <P> . . . </P>:
<P>
Текст
параграфа
</P>
На экране между параграфами вставляется пустая строка. Тэг окончания параграфа </P> можно не указывать. В этом случае тэг начала следующего параграфа <P> (или </BODY>) будет означать закрытие текущего.
Для указания одно- и многострочных комментариев в HTML-документе используется такая конструкция:
<!--
Этот текст браузером не обрабатывается.
Он закомментирован.
-->
Отметим, что комментарии помещаются в HTML-документе только между тэгами. Образец их использования приведен в примере № 2 Оглавление