Основные теги

Сначала мы рассмотрим самые основные теги языка HTML.

Ниже приведен листинг (исходный код) HTML-файла, который отображает одну строку текста.

1 <HTML>
2
3 
4 
5
6 <HEAD>
7 <TITLE>Учебник по HTML -
8 Основные теги</TITLE>
9 </HEAD>
10
11 <BODY>
12
13 <Р>Добро пожаловать на наш Web-сайт!</Р>
14
15 </BODY>
16 </HTML>

Здесь и далее я буду нумеровать в примерах каждую строку кода для пояснений. Если вы хотите проверить у себя, как будет работать код - создайте файл, например, main.html (как у меня) и скопируйте вышеприведённый код без нумерации строк. Запустите свой файл с кодом и, если вы всё сделали правильно и не допустили нигде синтаксических ошибок, то должны будете получить строку текста в браузере, как на рисунке ниже.

Результат работы кода.

Тег в строке 1

<HTML>

сообщает браузеру о том, что за открывающим тегом <HTML> и вплоть до закрывающего тега </HTML> (строка 16) следует текст HTML. Файл HTML всегда должен начинаться с тега <HTML > в первой строке документа и заканчиваться тегом </HTML> в последней строке.

Совет 1

Всегда включайте в начало и конец вашего HTML-документа теги <HTML> ...</HTML>. Включайте в код вашего документа комментарии. Комментарии в HTML заключаются в теги . Такие комментарии могут содержать в себе много полезной информации, которая браузером отображаться не будет. Они помогут вам, например, вспомнить свой собственный код, если вы не работали с ним какое-то время.

Первые комментарии, созданные нами, находятся в строках 3 и 4

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

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

В строках 6-9

<HEAD>
<TITLE>Учебник по HTML -
Основные теги</TITLE>
</HEAD>

находится секция заголовка нашей Web-страницы. Указание заголовка является обязательным требованием для каждого HTML-документа. Текст заголовка вводится в страницу Web при помощи парных тегов <TITLE>...</TITLE>, помещаемых внутри заголовочной части страницы.

Совет 2

Старайтесь придерживаться каких-то единых правил наименования страниц вашего сайта. Например, если ваш сайт называется "Мой Web-сайт", то для страницы, содержащей ссылки, можно было бы выбрать заголовок "Мой Web-сайт - Ссылки" или просто "Ссылки" и так далее. Посетителю вашего сайта будет проще ориентироваться в нём, если вы будете следовать этому простому правилу при выборе имён заголовков страниц. Кроме того это очень важный момент для внутренней оптимизации сайта. Но об этом речь пойдёт в других разделах сайта.

Итак, в элементе TITLE задаётся имя вашей Web-страницы. Обычно заголовок страницы отображается на цветном фоне в полосе в верхней части окна браузера. Этот же заголовок будет использоваться как текстовый идентификатор вашей страницы, если пользователь добавит её в список Favorites (Избранное) своего браузера. Помимо этого, заголовки страниц используются поисковыми системами при поиске и составлении каталогов; таким образом, правильный выбор названий страниц может привлечь на ваш сайт большее количество заинтересованных посетителей.

В строке 11 тег

<BODY>

открывает элемент BODY. В тело документа HTML помещается то содержание, которое должно отображаться браузером. Сюда входят текст, изображения, гиперссылки, формы и так далее. Позже в этом разделе мы обсудим много различных элементов, которые могут включаться в элемент BODY. В этих элементах можно заказывать цвет фона, цвет ссылок и тип шрифта. Пока мы будем использовать простейшую форму элемента <BODY>...</BODY>. Напоминаю вам, что вы не должны забывать указывать в конце документа закрывающий тег </BODY> перед закрывающим тегом </HTML>.

Для размещения текста в HTML документе используются различные элементы. В строке 13 мы видим элемент параграфа:

<Р>Добро пожаловать на наш Web-сайт!</Р>

Весь текст, помещённый между тегами <Р>...</Р>, образует один параграф. Этот параграф будет размещаться отдельно от остального материала страницы; он будет отделяться пустыми строками, вставляемыми до и после текста параграфа. Заданный в строке 13 HTML-текст будет отображаться браузером, как показано на рисунке выше

Код нашего примера заканчивается строками 15 и 16:

</BODY>
</HTML>

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

На главную