Внутри контейнера <BODY></BODY> размещается содержательная часть электронного документа. Сам тег <ВОDY> содержит ряд параметров, ни один из которых не является обязательным.
Параметры данного тега обеспечивают оформление всего тела документа. Перечислим их:
LINK - определяет исходный цвет ссылки;
BACKGROUND - задает URL изображения, определяющего фон тела документа;
BOTTOM MARGIN и TOPMARGIN - задает границу нижнего и верхнего полей документа в пикселах;
LEFTMARGIN и RIGHTMARGIN - границы левого и правого полей документа в пикселах;
BGCOLOR - задает цветовой оттенок фона документа (аналог тонирования бумаги, на которой печатается издание);
BGPROPERTIES - определяет свойства фона, задаваемого предыдущим параметром;
LINK - задает цвет еще не просмотренной ссылки;
SCROLL - определяет наличие полос прокрутки в документе, отображаемом в окне браузера;
TEXT - определяет цвет текста;
VLINK - цвет уже просмотренной ссылки.
Ряд параметров связаны с использованием цветовых оттенков в HTML-документах.
Отметим, что по умолчанию в них используется RGB цветовое пространство, причем значение каждого из основных цветов имеет 256 уровней и задается в виде двух цифр в 16-тиричной системе счисления от 00 до ЕЕ. Таким образом, цветовой тон задается последовательностью из шести 16-тиричных цифр, которым предшествует сим вол #, например последовательность #FFFFFF соответствует белому цвету максимальной интенсивности, а #800080 - фиолетовому тону, интенсивность которого равна половине от максимальной.
Приведем примеры использования параметров в теге <BODY>:
В первом примере задан синий цвет еще не просмотренной ссылки и в качестве фонового изображения используется файл background.gif, причем этот файл указан относительной ссылкой и находится в подкаталоге IMAGE. А во втором примере задан светлый фон для документа.
Теги логического форматирования текста
Теги логического форматирования текста позволяют выделить определенные типы текстовых фрагментов, т. е. осуществить структурную разметку текста. Их называют также тегами уровня блока, так как они не применимы к отдельным словам, а воздействуют лишь на фрагменты текста из нескольких слов.
Так, два тега <ABBR> и <ACRONYM> позволяют выделить аббревиатурные сокращения в пределах текста, причем второй используется для произносимой аббревиатуры. В теге <ACRONYM> может использоваться параметр TITLE, значением которого является полный текст сокращения. Например, контейнер:
<ACRONYM ТITLE='Московский Государственный Университет Печати'> МГУП </ACRONYM>
позволяет при указании курсором манипулятора мыши на аббревиатуру выводить во всплывающем окне соответствующий ей полный текст названия нашего Университета.
Тег-контейнер <СIТЕ> используется для выделения цитат, названий книг, газет и журналов. Браузеры обычно выводят текст, находящийся внутри контейнера, курсивом. Тег-контейнер <CODE> выводит текст как фрагмент программного кода (строки листинга программы) моноширинным шрифтом, a <DFN> отмечает текстовый фрагмент как определяемый термин. Аналогичным образом тег-контейнер <STRONG> выделяет содержимое как важные фрагменты текста.
Тег <INS> отмечает фрагмент текста как вставку, т. е. с его помощью можно отслеживать изменения, вносимые в основной текст. Тег может иметь два параметра: CITE (не путать с одноименным тегом) и DATETIME. С помощью первого параметра задается URL документа, поясняющего причины вставки, а второй параметр указывает дату и время вставки фрагмента с учетом часового пояса. Тег-контейнер <DEL> отмечает текст как намеченный к удалению. У него имеются параметры CITE и DATETIME, назначение которых точно такое, как в теге <INS>. Ниже приводятся несколько примеров записи тегов, которые, по нашему мнению, не требуют каких-либо комментариев.
<СIТЕ>'Известия'</СIТЕ> - Популярная Российская газета <DFN>Netscape Communicator 4.5</DFN>-Версия 4.5 популярного пакета фирмы Netscape, в который, в частности, вводится браузер для просмотра HTML-файлов
Определяют формат заключенного внутри соответствующих контейнеров текста при отображении на экране монитора. Как уже говорилось в начале этой главы, вместо них желательно использовать теги логического форматирования, если последние могут выполнить аналогичную функцию.
Так, тег-контейнер <В> выделяет заключенный внутри его текст полужирным начертанием. Аналогичным образом, теги <1> и <U> означают курсивное начертание и подчеркивание текста соответственно, а тег <ТТ> - моноширинный шрифт. Теги <STRIKE> и <5> совпадают по назначению и обеспечивают перечеркивание фрагмента текста горизонтальной линией, как намеченного к удалению. Надо отметить, что все перечисленные теги относятся к устаревшим и не рекомендуются к применению. Так, вместо тега <В> предпочтительнее использовать рассмотренный выше тег логического форматирования текста <STRONG>, вместо <STRIKE> или <5> - <DEL>, а вместо <ТТ> - <CODE>.
Из других тегов «шрифтового оформления» отметим <BIG> и<SMALL> которые увеличивают или уменьшают кегель шрифта на одну единицу, <SUB> и <SUP>, размещающие символы выше или ниже уровня строки. Более универсальным в этой группе является тег<ЕОМТ>, который имеет три параметра: FACE, SIZE и COLOR. Первый параметр позволяет указать используемую в текстовом фрагменте гарнитуру, причем, если такая гарнитура не установлена на компьютере, то параметр игнорируется. Можно задавать несколько наименований гарнитур, разделяя их запятыми, тогда будет использоваться первая по списку из имеющихся в наличии. Второй параметр задает размер (но не кегель) шрифта. Всего в языке HTML предусмотрено семь размеров, из которых третий номер используется по умолчанию. Последний параметр указывает цвет группы символов текста и может задаваться в виде группы из семи символов, как указывалось выше, или в наименованиях цветовых тонов. Приведем несколько примеров:
<FONT FACE='Arial','Courier' SIZE=5 COLOR=red> текст
</FONT>.
<FONT FACE='Times' SIZE=2 COLOR=#ffOOOO > текст </FONT>.
В первом примере символы текста, содержащиеся внутри контейнера, будут отображаться гарнитурой Arial, если она установлена на компьютере, а в противном случае, гарнитурой Courier. Размер символов будет достаточно велик и они будут красного цвета. Во втором примере будет использована гарнитура Times, размер символов будет на единицу меньше нормального и символы будут того же самого красного цвета. В последнем случае в окне браузера будет отображаться 52, причем размер показателя степени будет на единицу меньше, чем ее основания.
Третий пример иллюстрирует и другое важное свойство тегов-контейнеров физического форматирования текстовых символов: контейнеры могут быть вложены один в другой, причем глубина вложений формально не ограничена. При написании HTML-документа вручную необходимо только тщательно следить, чтобы контейнеры строго размещались один внутри другого. Действительно, в примере контейнер <SMALL> и </SMALL> расположен внутри <SUB> и </SUB>, а последний вложен в контейнер <FONT> и </FONT>.
Все рассмотренные выше теги физического форматирования, если их действие рассматривать подобно функциям текстовых редакторов, относятся к шрифтовому оформлению текстовых фрагментов. Поэтому далее следует остановиться на тегах, выполняющих функции, подобные форматированию абзаца. К ним, в частности, относится тег разделения документа на абзацы <Р>, который помещается перед началом очередного абзаца. Закрывающий тег </Р> не обязателен. Браузеры обычно отделяют абзацы друг от друга пустой строкой. Параметром этого тега является ALIGN, т. е. выравнивание. Параметры выравнивания: LEFT, CENTER, RIGHT и JUSTIFY, причем последний только сравнительно недавно начал поддерживаться браузерами.
При отображении документов в окне браузера место перевода строки определяется автоматически, в соответствии с реальными размерами его окна. В тех случаях, когда требуется выполнить принудительный перевод строки в определенном месте, используется тег <BR>, у которого нет закрывающего тега. Тег <BR>, в частности, используется при работе со стихотворными строками. В отличии от тега <Р>, при использовании тега <BR> браузер не генерирует на экране пустую строку.
Размер текста, помещенного внутри HTML-документа, формально не ограничен, т. е. он может быть эквивалентен множеству печатных страниц. На практике это обстоятельство приводит к появлению длинных страниц, для просмотра которых требуется вертикальная полоса прокрутки. Поэтому предусмотрена возможность разбивки такого протяженного текста на отдельные главы и параграфы с помощью заголовков различного уровня.
Для разметки заголовков служат шесть тегов-контейнеров <Н1> . . <Нб>, причем теги с меньшими номерами определяют заголовки более высокого уровня. Все перечисленные теги относятся к уровню блока, т. е. не могут использоваться для разметки отдельных слов. В качестве единственного параметра этих тегов используется ALIGN, который задает способ выравнивания заголовка (точно так же, как в теге <Р>). Например,
<Hl ALIGN=CENTER> Заголовок 1-го уровня </Н1>
<НЗ ALI6N=LEFT> Заголовок 3-го уровня </НЗ>.
В первом примере заголовок выравнивается по центру и в нем используется наибольший размер кегля шрифта, такой как в теге <FONT SIZE=7>. Во втором случае текст заголовка выравнивается полевому краю, а размер шрифта соответствует значению пара метра SIZE=5. Во всех случаях заголовки выделяются осветленным пространством в виде пропущенной строки до и после строки заголовка и полужирным шрифтом самого заголовка. Наконец, тег заголовка аккумулирует в себе функции тега абзаца, т. е. нет необходимости в использовании одновременно с тегом <НЗ> еще и тега <Р>.
Помимо заголовков, для разделения документа на отдельные разделы могут использовать горизонтальные линии, играющие ту же роль, что и орнаментальные линейки в печатных изданиях, где такие линейки используются в конце определенных разделов, отделяя предыдущий фрагмент издания от последующего. Для генерации таких линий в электронном документе используется тег <ВР>, который не является контейнером. В теге могут использоваться пять различных параметров. Параметр выравнивания ALIGN может принимать значения LEFT, CENTER и RIGHT. Параметр WIDTH задает длину линии в пикселах или в процентах от ширины окна браузера, что обычно предпочтительнее, a SIZE определяет толщину линии в пикселах. Параметр COLOR определяет цветовые характеристики линии, т. е. реализует те же функции, что и аналогичный параметр в теге <Р>. Наконец, параметр NOSHADE отменяет рельефный характер линии, причем у него значение отсутствует, само наличие в теге этого параметра характеризует отсутствие рельефа. Пример записи тега:
<ВР ALIGN=CENTER WIDTH=75% SIZE=8 COLOR=#800080>
На практике мы иногда сталкиваемся со случаями, когда в HTML-документ необходимо включить уже отформатированный текст, причем он должен отображаться браузером так, как он был подготовлен в текстовом редакторе. Для этой цели предусмотрен тег-контейнер <PRE>. После этого тега можно включить предварительно отформатированный текст, который должен в том же виде выводиться в окне браузера.
Для включения цитат большой протяженности (много сотен символов) предназначен тег-контейнер <BLOCKQUOTE>.
Это - тег уровня блока. Браузеры выделяют текст, размещенный внутри такого контейнера, пустыми строками до и после и небольшим отступом слева по отношению к основной части документа. Поэтому тег <BLOCKQUOTE> можно использовать не только для длинных цитат, но и для выделения некоторых блоков текста.
Из других тегов уровня блока, используемых для выделения фрагментов документа, можно отметить <DIV>. Используя контейнер с этим тегом, можно управлять параметрами данного фрагмента путем назначения стилей, например
выделит все текстовые элементы указанного фрагмента зеленым цветом.
Тег-контейнер уровня блока <CENTER> предназначен для горизонтального выравнивания всех заключенных в него элементов посередине окна просмотра браузера.
Косвенное отношение ко всем рассмотренным в данном разделе тегам имеет тег-контейнер <ADDRESS>, который применяется для указания автора, владельца авторских прав, адреса автора, а иногда и даты создания и последнего обновления электронного издания. Текст внутри такого контейнера обычно отображается браузерами курсивом. Соответствующий пример мы приведем в конце главы, сравнивая исходный HTML-код и отображение документа в окне браузера.
Специфическим видом текста, который иногда включают в электронное издание является бегущая строка. Для создания бегущей строки используется тег-контейнер <MARQUEE>. В теге используется ряд параметров: DIRECTION, BEHAVIOR, WIDTH, HEIGHT, LOOP, SCROLLDELAY, BGCOLOR. Первый параметр определяет направление движения строки и принимает значения LEFT или RIGHT. Параметры WIDTH и HEIGHT позволяют задать размеры окна, в котором движется строка текста. Размеры задаются в пикселах или в процентах от ширины и высоты страницы. Параметр LOOP задает число повторов цикла перемещения строки, если он вообще не упомянут, то число повторов бесконечно. Параметр SCROLLDELAY определяет период повторения изображения движущегося текста в миллисекундах. Наконец, значение BGCOLOR позволяет стандартным способом определить цвет фона окна, в котором движется строка текста. Если требуется изменить гарнитуру, кегль, цвети другие параметры шрифта бегущей строки, то следует тег-контейнер <MARQUEE> поместить внутрь тега-контейнера <FONT>, в котором и задать все характеристики шрифта.
Оформление списков терминов и определений
Списки принадлежат к наиболее употребительным формам как в электронных, так и в печатных изданиях. Возможность представления списковых структур предусмотрена практически во всех текстовых редакторах, в частности, развитая система для списковых структур имеется в MS Word, весьма популярном редакторе в нашей стране. В HTML-документах наряду с обычными маркированным и нумерованным списками предусмотрен отдельный список определений. Оформление этих списков посредством специальных тегов составит предмет этого параграфа.
Маркированные списки
Создаются с помощью тега-контейнера <UL> (Unordered List - неупорядоченный список). В теге могут использоваться два параметра: COMPACT, который изначально предназначался для вывода элементов списка в компактной форме (уменьшенным кеглем и расстоянием между строками) и TYPE, который используется для принудительного задания вида маркера. Параметр COMPACT не имеет значений. Современными браузерами он игнорируется. Параметр TYPE может принимать одно из трех значений: disc, circle и square. В первом случае маркеры (bullets) имеют вид закрашенного круга, во втором - окружности малого диаметра, в третьем - закрашенного квадрата. По умолчанию значение TYPE=disk.
Каждому элементу списка предшествует тег <LI> (List Item - элемент списка), который необязательно должен быть контейнером. В качестве параметра этого тега также используется TYPE, который может принимать те же самые три значения. Таким образом, в списке принципиально могут использоваться и различные маркеры для представления отдельных элементов.
Создание нумерованных списков
Нумерованный список организуется с помощью тега-контейнера <OL> (Ordered List), внутри которого размещаются все элементы списка. Открывающий и закрывающий теги обеспечивают пропуски строк до и после списка, выделяя его таким образом в документе. В составе тега могут использоваться три параметра: COMPACT, TYPE и START. Смысл первого параметра тот же самый, что и в теге <UL>. Параметр TYPE по-прежнему определяет тип маркера, причем TYPE=1 определяет маркеры в виде арабских цифр, TYPE=A задает маркеры в виде прописных букв латинского алфавита, TYPE=a - в виде строчных латинских букв, наконец, TYPE=I и TYPE=i определяют маркеры в виде римских цифр, больших и малых соответственно.
Параметр TYPE, заданный в форме определенного числа, определяет начало отсчета для первого элемента списка.
Каждый элемент нумерованного списка предваряется тегом <LI>. Вэтом случае в состав тега может входить параметр VALUE, позволяющий изменять номер очередного элемента списка, в результате чего соответственно изменяются и все последующие номера. В качестве примера можно привести фрагмент спортивных новостей, где содержатся результаты какого-либо соревнования:
<HTML><HEAD><TITLE> Пример нумерованного списка </TITLE></HEAD
<BODY><OL><B> Результаты чемпионата мира по гандболу 2001</В>
<LI> Франция
<LI> Румыния
<LI> Германия
<BR>. . .
<LI VALUE=6> Россия
<LI> Украина
</OL></BODY></HTML>
Название документа, размещенного в теге-контейнере <TITLE> в заголовочной части документа, выведено в строке заголовка браузера. Название списка в теле документа показано полужирным шрифтов непосредственно перед списком. Нумерация списка по умолчанию производится арабскими цифрами, так как параметр TYPE в теге <OL> отсутствует. Нумерация списка начинается по умолчанию с первого номера, так как и параметр START в теге <OL> отсутствует. С помощью параметра VALUE=6 в одном из тегов <LI> изменен номер очередного элемента списка, а дальнейшая нумерация продолжается с нового номера. Для создания отточия использован тег принудительного перевода строки <BR>.
Списки определений
В научно-технических и учебных изданиях нередко используют списки или словари определений, которые в зарубежных книгах называют глоссариями. (Например, см. ). Каждый элемент такого списка начинается с определяемого термина, после которого следуетего определение. Для создания списка определений служит тег-контейнер <DL> (Definition List), внутри котороготег<ОТ> (Definition Term) задает определяемый термин в форме единственной строки, а тег<00> (Definition Description) предшествует абзацу с определением этого термина. Для примера приведем фрагмент списка определений для компьютерной графики.
<html><head><title>Cписок терминов и определений </title></head>
<body bgcolor=#d5d5d5><DL><ОТ>Пиксел
<DD>Наименьший элемент изображения, который характеризуется постоянством параметров по всей своей поверхности <DT> Разрешение монитора
<DD> Разрешение монитора определяется количеством пикселов на единицу длины и составляет около 96 пикселей на дюйм <ОТ>Линиатура растра
<DD> Частота размещения растровых точек в плоскости изображения, измеряется числом линий на дюйм </DL></body></html>
Отображение этого файла в окне просмотра браузера показано на рис. 2.5. Как следует из записи исходного HTML-документа никаких попыток выравнивания текста и формирования отступов не производилось. Сами теги <DT> и <DD> так форматируют текст, что обеспечивают оптимальное его восприятие пользователем. Фон документа задается определенным уровнем серого в соответствии со значением параметра BGCOLOR в теге <BODY>. Кстати, язык HTML, как следует из представленного выше фрагмента HTML-кода, нечувствителен к регистру.
Многоуровневые списковые структуры
Многоуровневые списки в HTML-документах могут создаваться путем вложения одного типа списка внутрь другого. Например, фрагменты нумерованного списка могут быть вложены внутрь маркированного или наоборот. Сказанное иллюстрируется простым примером, в котором перечисляются спутники некоторых планет нашей солнечной системы.
<HTML><HEAD><TITLE> Пример двухуровневого списка </TITLE></HEAD
<BODY><OL><B> Спутники планет </В>
<BR> ....
<LIбл/> ЗЕМЛЯ
<OL><LI> Луна </OL>
<LI>MAPC
<OL><LI> Фобос
<LI> Деймос </OL>
<BR> ....
</UL></BODY></HTML>
Отображение двухуровнего списка в окне браузера показано на рис. 2.6. Внутри тега-контейнера маркированного списка <UL> размещены два контейнера нумерованного списка <О1_> и </О1_> со своими тегами <LI> каждый. Дополнительный отступ слева обеспечивает хорошую читаемость текста. По этой схеме можно создавать и многоуровневые списки.
