|
Это руководство было взято с компакт - диска ("Web Дизайн. 2003г."). Автор неизвестен,
авторских прав на диске также не имеется.
Практическое руководство по 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>
Как видно из примера,
вся информация о форматировании документа сосредоточена в его фрагментах,
заключенных между знаками "<" и ">".
Такой фрагмент (например, ) называется меткой (по-английски — 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">
Подытожим все, что мы знаем, с помощью примера 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-документ.
Начнем с малого — с абзаца.
вверх
<<< Глава 1. Вводные замечания
Глава 3. Внутри абзаца >>>
|
На главную
