Как устроен
HTML-документ
HTML-документ — это просто текстовый
файл с расширением *.html (Unix-системы могут
содержать файлы с расширением *.htmll). Вот
самый простой HTML-документ:
<html>
<head>
<title>
Пример
1
</title>
</head>
<body>
<H1>
Привет!
</H1>
<P>
Это
простейший пример HTML-документа.
</P>
<P>
Этот
*.html-файл может быть
одновременно открыт и в Notepad, и в Netscape.
Сохранив изменения в Notepad, просто нажмите
кнопку Reload ('перезагрузить') в Netscape,
чтобы увидеть эти изменения реализованными
в HTML-документе.
</P>
</body>
</html>
Если хотите, можно посмотреть
этот пример прямо сейчас.
Для удобства чтения я ввел
дополнительные отступы, однако в HTML это совсем не
обязательно. Более того, браузеры просто
игнорируют символы конца строки и множественные
пробелы в HTML-файлах. Поэтому наш пример вполне
мог бы выглядеть и вот так:
<html>
<head>
<title>Пример 1</title>
</head>
<body>
<H1>Привет!</H1>
<P>Это простейший пример HTML-документа.</P>
<P>Этот *.html-файл может быть одновременно
открыт
и в Notepad, и в Netscape.
Сохранив изменения в Notepad, просто нажмите кнопку
Reload ('перезагрузить') в Netscape, чтобы увидеть
эти изменения реализованными в
HTML-документе.</P>
</body>
</html>
Как видно из примера, вся информация о
форматировании документа сосредоточена в его
фрагментах, заключенных между знаками "<" и
">". Такой фрагмент (например, <html>)
называется меткой (по-английски — tag, читается
"тэг").
Большинство HTML-меток — парные, то есть
на каждую открывающую метку вида <tag> есть
закрывающая метка вида </tag> с тем же
именем, но с добавлением "/".
Метки можно вводить как большими, так и
маленькими буквами. Например, метки <body>, <BODY>
и <Body> будут восприняты браузером
одинаково.
Многие метки, помимо имени, могут
содержать атрибуты — элементы, дающие
дополнительную информацию о том, как браузер
должен обработать текущую метку. В нашем
простейшем документе, однако, нет ни одного
атрибута. Но мы обязательно встретимся с
атрибутами уже в следующем разделе.
Обязательные метки
<html> ... </html>
Метка <html> должна открывать
HTML-документ. Аналогично, метка </html>
должна завершать HTML-документ.
<head> ... </head>
Эта пара меток указывает на начало и
конец заголовка документа. Помимо наименования
документа (см. описание метки <title> ниже), в
этот раздел может включаться множество
служебной информации, о которой мы обязательно
поговорим чуть позже.
<title> ... </title>
Все, что находится между метками <title>
и </title>, толкуется браузером как название
документа. Netscape Navigator, например, показывает
название текущего документа в заголовке окна и
печатает его в левом верхнем углу каждой
страницы при выводе на принтер. Рекомендуется
название не длиннее 64 символов.
<body> ... </body>
Эта пара меток указывает на начало и
конец тела HTML-документа, каковое тело,
собственно, и определяет содержание документа.
<H1> ... </H1> — <H6> ... </H6>
Метки вида <Hi> (где i —
цифра от 1 до 6) описывают заголовки шести
различных уровней. Заголовок первого уровня —
самый крупный, шестого уровня, естественно —
самый мелкий.
<P> ... </P>
Такая пара меток описывает абзац. Все,
что заключено между <P> и </P>,
воспринимается как один абзац.
Метки <Hi> и <P> могут
содержать дополнительный атрибут ALIGN
(читается "элайн", от английского
"выравнивать"), например:
<H1 ALIGN=CENTER>Выравнивание заголовка
по центру</H1>
или
<P ALIGN=RIGHT>Образец абзаца с выравниванием
по правому краю</P>
Подытожим все, что мы знаем, с помощью примера 2:
<html>
<head>
<title>Пример 2</title>
</head>
<body>
<H1 ALIGN=CENTER>Привет!</H1>
<H2>Это чуть более сложный пример
HTML-документа</H2>
<P>Теперь мы знаем, что абзац можно выравнивать
не только влево, </P>
<P ALIGN=CENTER>но и по центру</P>
<P ALIGN=RIGHT>или по правому краю.</P>
</body>
</html>
С этого момента Вы знаете достаточно,
чтобы создавать простые HTML-документы
самостоятельно от начала до конца. В следующем
разделе мы поговорим, как можно улучшить наш
простой HTML-документ. Начнем с малого — с абзаца. |
