01. Простейшая HTML-страничка

Сейчас вы читаете текст, который показывает браузер, выполняя программу, написанную на языке HTML. Некоторые слова в этом тексте выделены цветом и подчёркнуты. Указатель мыши, попадая на такие выделения, превращается из обычного курсора в указующий перст: это ссылка! Достаточно щёлкнуть на ссылке мышкой, как текущий текст на экране заменится тем, на который ссылка настроена.

Гипертекстовую страницу часто называют гипертекстовым документом или просто документом.

Устройство кода простейшей гипертекстовой страницы будет изучено на следующем примере:

Объекты документа (заголовки, абзацы, рисунки…) описываются на HTML при помощи элементов (конструкций языка HTML) для построения которых используются теги.

Таким образом, объекты страницы описываются элементами, элементы строятся из тегов.

Тег — элементарный строительный кирпичик HTML. Чтобы отличить тег от обычного текста, он обрамляется угловыми скобками.

Как правило, теги парные. Первый тег отмечает начало элемента, второй, отличающийся от первого наличием косой черты “/” перед именем тега, — его конец.

В приведённом выше коде тег <H1> отмечает начало заголовка, а тег </H1> — его конец. Таким образом, элемент “заголовок” задаётся парой тегов: <H1>...</H1>.

Некоторые элементы описываются одиночными тегами. В том же примере одиночный тег <HR> задаёт элемент “горизонтальная линия”.

Вам понятно, чем элемент отличается от тега?

Элемент — это конструкция языка для описания объекта гипертекстовой страницы, а тег — средство языка для построения элемента. Элемент может задаваться как одним тегом, так и парой, между которыми располагается текст и (или) другие элементы.

Элемент, описываемый парой тегов, похож на сэндвич — между двумя кусочками хлеба (открывающим и закрывающим тегами) расположена начинка — содержимое элемента. Так, теги <P> и </P> обозначают границы абзаца, текст абзаца располагается между ними.

Когда элемент задаётся одним тегом, он, подобно кусочку хлеба, является самостоятельным “продуктом питания” для браузера. Так, тег <HR> задаёт линию, которую браузер прочерчивает по горизонтали на экране.

И теги и элементы — конструкции языка HTML, но тег — более мелкая строительная единица. Теги используются для построения элементов по одному из двух правил.

1. Элемент совпадает с тегом <ИМЯ>.

   Пример: <HR>.

2. Элемент строится по формуле <ИМЯ>тело</ИМЯ>, где тело содержит текст и (или) другие элементы.

   Пример: <H1>Первый HTML-документ</H1>.

Для обозначения элемента будем использовать имя соответствующего тега.

Будем говорить: элемент P задаётся парой тегов <P> и </P>, а элемент HR задаётся одиночным тегом <HR>.