|
HyperText Markup Language (HTML)
является стандартным языком, предназначенным для создания гипертекстовых
документов в среде WEB. HTML-документы могут просматриваться различными
типами WEB-броузеров. Когда документ создан с использованием HTML,
WEB-броузер может интерпретировать HTML для выделения различных
элементов документа и первичной их обработки. Использование HTML
позволяет форматировать документы для их представления с использованием
шрифтов, линий и других графических элементов на любой системе, их
просматривающей.
Большинство документов имеют
стандартные элементы, такие, как заголовок, параграфы или списки.
Используя тэги HTML вы можете обозначать данные элементы, обеспечивая
WEB-броузеры минимальной информацией для отображения данных элементов,
сохраняя вцелом общую структуру и информационную полноту документов. Все
что необходимо, чтобы прочитать HTML-документ - это WEB-броузер, который
интерпретирует тэги HTML и воспроизводит на экране документ в виде,
который ему придает автор.
В большинстве случаев автор
документа строго определяет внешний вид документа. В случае HTML
читатель (основываясь на возможностях WEB-броузера может, в определенной
степени, управлять внешним видом документа (но не его содержимым). HTML
позволяет отметить, где в документе должен быть заголовок или абзац при
помощи тэга HTML, а затем предоставляет WEB-броузеру интерпретировать
эти тэги. Например, один WEB-броузер может распознавать тэг начала
абзаца и представлять документ в нужном виде, а другой не имеет такой
возможности и представляет документ в одну строку. Пользователи
некоторых WEB-броузеров имеют, также, возможность настраивать размер и
вид шрифта, цвет и другие параметры, влияющие на отображение документа.
HTML-тэги могут быть условно
разделены на две категории:
-
тэги, определяющие, как будет отображаться
WEB-броузером тело документа вцелом
-
тэги, описывающие общие свойства документа,
такие как заголовок или автор документа
Запомните, что основное
преимущество HTML заключается в том, что ваш документ может быть
просмотрен на WEB-броузерах различных типов и на различных платформах.
Как создаются HTML документы?
HTML-документы могут быть созданы
при помощи любого текстового редактора или специализированных
HTML-редакторов и конвертеров. Выбор редактора, который будет
использоваться для создания HTML-документов, зависит исключительно от
понятия удобства и личных пристрастий каждого автора.
Например, HTML редакторы, такие,
как "Netscape Navigator Gold" компании Netscape позволяют
создавать документы графически с использованием технологии WYSIWYG (What
You See Is What You Get). С другой стороны, большинство традиционных
средств для создания документов имеют конвертеры, позволяющие
преобразовывать документы к формату HTML.
Основные положения
Все тэги HTML начинаются с "<"
(левой угловой скобки) и заканчиваются символом ">" (правой угловой
скобки). Как правило, существует стартовый тэг и завершающий тэг. Для
примера приведем тэги заголовка, определяющие текст, находящийся внутри
стартового и завершающего тэга и описывающий заголовок документа:
<TITLE> Заголовок документа </TITLE>
Завершающий тэг выглядит также, как
стартовый, и отличается от него прямым слэшем перед текстом внутри
угловых скобок. В данном примере тэг <TITLE> говорит WEB-броузеру об
использовании формата заголовка, а тэг </TITLE> - о завершении текста
заголовка.
Некоторые тэги, такие, как <P>
(тэг, определяющий абзац), не требуют завершающего тэга, но его
использование придает исходному тексту документа улучшенную читаемость и
структурируемость.
HTML не реагирует на регистр
символов, описывающих тэг, и приведенный ранее пример может выглядеть
следующим образом:
<title> Заголовок документа </title>
Внимание! Дополнительные
пробелы, символы табуляции и возврата каретки, добавленные в
исходный текст HTML-документа для его лучшей читаемости, будут
проигнорированы WEB-броузером при интерпретации документа.
HTML-документ может включать вышеописанные элементы только если они
помещены внутрь тэгов <PRE> и </PRE>. Более подробно о тэгах <PRE>
будет написано ниже.
Структура документа
Когда WEB-броузер получает
документ, он определяет, как документ должен быть интерпретирован. Самый
первый тэг, который встречается в документе, должен быть тэгом <HTML>.
Данный тэг сообщает WEB-броузеру, что ваш документ написан с
использованием HTML. Минимальный HTML-документ будет выглядеть так:
<HTML> ...тело документа... </HTML>
Заголовочная часть документа <HEAD>
Тэг заголовочной части документа
должен быть использован сразу после тэга <HTML> и более нигде в теле
документа. Данный тэг представляет из себя общее описание документа.
Избегайте размещать какой-либо текст внутри тэга <HEAD>. Стартовый тэг <HEAD>
помещается непосредственно перед тэгом <TITLE> и другими тэгами,
описывающими документ, а завершающий тэг </HEAD> размещается сразу после
окончания описания документа Например:
<HTML>
<HEAD>
<TITLE> Список сотрудников </TITLE>
</HEAD>
...
Внимание! Технически, стартовые
и завершающие тэги типа <HTML>, <HEAD> и <BODY> необязательны. Но
настоятельно рекомендуется их использовать, поскольку использование
данных тэгов позволяет WEB-броузеру уверенно разделить заголовочную
часть документа и непосредственно смысловую часть.
Заголовок документа <TITLE>
Большинство WEB-броузеров
отображают содержимое тэга <TITLE> в заголовке окна, содержащего
документ и в файле закладок, если он поддерживается WEB-броузером.
Заголовок, ограниченный тэгами <TITLE> и </TITLE>, размещается внутри <HEAD>-тэгов,
как показано выше на примере. Заголовок документа не появляется при
отображении самого документа в окне.
Комментарии
Как любой язык, HTML позволяет
вставлять в тело документа комментарии, которые сохраняются при передаче
документа по сети, но не отображаются броузером. Синтаксис комментария:
<!-- Это комментарий -->
Комментарии могут встречаться в
документе где угодно и в любом количестве.
Тэги тела документа
Тэги тела документа идентифицируют
отображаемые в окне компоненты HTML-документа. Тело документа может
содержать ссылки на другие документы, текст и другую форматированную
информацию.
Тело
документа <BODY>
Тело документа должно находиться
между тэгами <BODY> и </BODY>. Это та часть документа, которая
отображается как текстовая и графическая (смысловая) информация вашего
документа.
Уровни
заголовков <Hx>
Когда пишется HTML-документ, текст структурно делится
на просто текст, заголовки частей текста, заголовки более высокого
уровня и т.д. Первый уровень заголовков (самый большой) обозначается
цифрой 1, следующий - 2, и т.д. Большинство броузеров поддерживает
интерпретацию шести уровней заголовков, определяя каждому из них
собственный стиль. Заголовки выше шестого уровня не являются стандартом
и могут не поддерживаться броузером. Заголовок самого верхнего уровня
имеет признак "1". Синтакс заголовка уровня 1 следующий:
<H1> Заголовок первого уровня </H1>
Заголовки другого уровня могут быть
представлены в общем случае так:
<Hx> Заголовок x-го уровня </Hx>
где x - цифра от 1 до 6,
определяющая уровень заголовка.
Тэг абзаца <P>
В отличии от большинства текстовых
процессоров, в HTML-документе обычно игнорируются символы возврата
каретки. Физический разрыв абзаца может находиться в любом месте
исходного текста документа (для удобства его читаемости). Однако броузер
разделяет абзацы только при наличии тэга <P>. Если вы не разделите
абзацы тэгом <P>, ваш документ будет выглядеть как один большой абзац.
Дополнительные параметры тэга <P>:
<P ALIGN=left|center|right>
позволяют выравнивать абзац по
левому краю, центру и правому краю соответственно.
Центрирование элементов документа
Вы можете центрировать все элементы
документа в окне броузера. Для этого можно использовать тэг <CENTER>.
Все элементы между тэгами
<CENTER>
и </CENTER>
будут находиться в центре окна
Тэг преформатирования <PRE>
Tэг преформатирования, <PRE>,
позволяет представлять текст со специфическим форматированием на экране.
Предварительно сформатированный текст заканчивается завершающим тэгом </PRE>.
Внутри предварительно сформатированного текста разрешается использовать:
Использование тэгов, определяющих
формат абзаца, таких как <Hx> или <ADDRESS>, будет игнорироваться
броузером при помещении их между тэгами <PRE> и </PRE>.
Далее идет несколько более
подробный пример, собранный из предыдущих:
<HTML>
<HEAD>
<TITLE> Список сотрудников </TITLE>
</HEAD>
<BODY>
<H2> Список сотрудников нашей фирмы </H2>
<H3> Составлено : 30 июля 1996 года </H3>
Данный список содержит фамилии, имена и отчества
всех сотрудников нашей компании. <P>
Список может быть использован только в служебных целях. <P>
</BODY>
</HTML>
Вот, что вы увидите на экране броузера:
Список сотрудников нашей фирмы
Составлено : 30 июля 1996 года
Данный список содержит фамилии,
имена и отчества всех сотрудников нашей компании.
Список может быть использован
только в служебных целях.
Внимание! Заголовок "Список
сотрудников" не отображен броузером как часть документа. Он появится
в заголовке окна броузера.
Разрыв строки <BR>
Тэг <BR> извещает броузер о разрыве
строки. Наилучший пример использования данного тэга - форматированный
адрес или любая другая последовательность строк, где броузер должен
отображать их одну под другой. Например:
Алексей Ярцев <BR>
Дмитровское шоссе, <BR>
д.9Б, офис 326 <BR>
Дополнительный параметр позволяет расширить
вохможности тэга <BR>.
<BRCLEAR=left|right|all>
Данный параметр позволяет выполнить
не просто перевод строки, а разместить следующую строку, начиная с
чистой левой (left), правой (right) или обоих (all) границ окна броузера.
Например, если рядом с текстом слева встречается рисунок, то можно
использовать тэг <BR> для смещения текста ниже рисунка:
<p> Как вы можете видеть,
данная схема демонстрирует связь<BR CLEAR=left>
<img src="http://www.softexpress.com/images/schema1.gif" align=baseline>
Мастер/Деталь </p>
Неразрывная строка <NOBR>
Если вы не хотите, чтобы броузер
автоматически переносил строку, то вы можете обозначить ее тэгами <NOBR>
и </NOBR>. В этом случае броузер не будет переносить строку даже если
она выходит за нраницы экрана; вместо этого броузер позволит
горизонтально прокручивать окно. Например:
<NOBR> Данная строка является
самой длинной строкой документа, которая не допускает какого-либо
разбиения где бы то ни было </NOBR>
Если же вы хотите все же позволить
разбиение данной строки на две, но в строго запланированном месте, то
вставьте тэг <WBR> в это место. Например:
<NOBR> Данная строка является
самой длинной строкой документа,<WBR> которая не допускает какого-либо
разбиения где бы то ни было </NOBR>
Данная строка является самой длинной строкой документа,
которая не допускает какого-либо разбиения где бы то ни было
Цитата <BLOCKQUOTE>
Данный тэг предназначен для
обозначения в документе цитаты из другого источника. Текст, обозначенный
тэгом <BLOCKQUOTE>, отступает от левого края документа на 8 пробелов.
Например:
На открытии данной конференции
глава представительства произнес: <P>
<BLOCKQUOTE>
Сегодня один из величайших дней для нашей компании. <BR>
Мы открыли новую технологию, позволяющую нашим клиентам повысить
производительность их настольных систем в несколько раз.
</BLOCKQUOTE>
При отображении броузером данный текст будет
выглядеть так:
На открытии данной конференции глава
представительства произнес:
Сегодня один из величайших дней
для нашей компании.
Мы открыли новую технологию, позволяющую нашим клиентам повысить
производительность их настольных систем в несколько раз.
Список базовых тэгов HTML
|
Стартовый
|
Завершающий |
Описание
|
|
<HTML> |
</HTML> |
Обозначение HTML-документа |
|
<HEAD> |
</HEAD> |
Заголовочная часть документа |
|
<TITLE> |
</TITLE> |
Заголовок документа |
|
<BODY> |
</BODY> |
Тело документа |
|
<H1> |
</H1> |
Заголовок абзаца первого уровня</ td>
|
|
<H2> |
</H2> |
Заголовок абзаца второго уровня |
|
<H3> |
</H3> |
Заголовок абзаца третьего уровня |
|
<H4> |
</H4> |
Заголовок абзаца четвертого уровня |
|
<H5> |
</H5> |
Заголовок абзаца пятого уровня |
|
<H6> |
</H6> |
Заголовок абзаца шестого уровня |
|
<P> |
</P> |
Абзац |
|
<PRE> |
</PRE> |
Форматированный текст |
|
<BR> |
|
Перевод строки без конца абзаца |
|
<BLOCKQUOTE> |
</BLOCKQUOTE> |
Цитата |
Описанные ранее тэги - это все, что
необходимо вам для того, чтобы начать работать с HTML.
С использованием описанных тэгов вы можете создать простой
HTML-документ. Однако, следующие разделы позволят вам существенно
улучшить внешний вид ваших документов и опишут новые возможности HTML
|