На главную

 


Глава 2. Наш первый HTML-документ 

Глава 2. Наш первый HTML-документ 

Как устроен 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-документ. Начнем с малого — с абзаца. 

 

ДОМОЙ

 

 

Rambler's Top100 .RU
Hosted by uCoz