Created using
htm2chm 3.0

Download it NOW!


WMASTER.RU - Всё для web-мастера

www.wmaster.ru
Wmaster.ru

На главную

Введение в дизайн

СТАТЬИ

Хостинг

CODY REG][STER

DOCS

КАТАЛОГ ссылок

Коллекция шрифтов

DESIGN.STudio

Клуб Webмастеров

Рейтинг (top-100)
Скрипты

Секреты мастеров

Soft

Журнал Wmaster

Опросы

Ссылки web-мастеру

Электронные журналы

Обратная связь

Гостевая книга

ФоруМ

web-mastering
Азы языка HTML
Programming
HTML-редакторы
Apache
MySQL
XML
Flash
Photoshop
.htaccess
Всё для форумов
Clipart
3DSMax
SSI
CSS
Технология раскрутки
Авторское право
Кодовые таблицы
Важное

Windows

Links
Woweb.ru - портал для Веб-Мастера
SAD-Raven
NBSP.RU
PHP скрипты
CN-Software
MOROZOV.BIZ
Глава 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-документ. Начнем с малого — с абзаца.

[ К следующей главе | К оглавлению | К предыдущей главе ]

Партнеры Wmaster
srez.ru: Новости, уроки DreamWeaver, PhotoShop, HTML
Лучшее веб-мастеру
PIXELATE - Первый в рунете сайт о пиксельной графике! Уроки, галлерея, форум и многое другое!
Поиск по сайту
Объявления
Обмен ссылками
Наши баннеры
О проекте

Реклама
(понижение цен)

Об Авторе
Контакты new!
Архив рассылки
Продажа доменов
Запомнить эту страницу
Сделать стартовой
Хостинг
Хостинг Без Ограничений.
Рассылки от Wmaster.Ru
Wmaster.ru - всё для вебмастера.
Наша кнопка

Все желающие могут поставить нашу кнопочку к себе на сайт
Всё для веб-мастеров

Бочкарёв Антон
ICQ: 148780826
Hosted by Valuehost
© RUscripts.design 2003

© Wmaster Design Group 2001-2003. © Все права защищены. При перепечатке любого материала с сайта ссылка на http://www.wmaster.ru/ обязательна.
Для просмотра рекомендуется разрешение 1024*768, браузер Internet Explorer. Для более эффективного просмотра нажмите F11.