Дочитав до этого места, вы уже поняли, чем отличается
создание HTML-документов от подготовки документов в текстовом
процессоре. Игнорируя физические характеристики документа
(такие как величина полей, начертание шрифта и задание
абзацных отступов), теги HTML в основном описывают содержание
документа и смысловое назначение его элементов. HTML-разметка
обеспечивает классификацию групп слов и абзацев, но не
определяет того, как будет выглядеть документ на экране.
Существует всего несколько тегов, которые явно задают
параметры визуализации текста, например, коды полужирного
шрифта <B> или курсива <I>. Большинство же тегов
предназначены для выделения семантики документа, а не для
определения его визуальных характеристик. В этой главе мы
расскажем о заложенных в HTML возможностях описания различных
частей страницы и покажем, как такая страница будет выглядеть
в различных web-броузерах.
Расширения HTML от фирмы Netscape Большинство
тегов, рассмотренных в данной главе, представляют собой
стандартные команды HTML. Однако некоторые теги были добавлены
компанией Netscape Communications. Использовать эти расширения
следует с осторожностью, поскольку полученная страница может
великолепно выглядеть в броузере Netscape и отвратительно - в
других программах просмотра Web. Чтобы быть уверенным в
приемлемом результате, следует проверить вид документа в
нескольких броузерах.
Элементы и атрибуты абзаца В пятой и шестой
главах были описаны две основные процедуры ввода
HTML-элементов в HoTMetaL PRO. Можно сначала ввести текст,
выделить его, и затем задать стиль с помощью команды Markup д
Insert Element. После этого по краям выделенного текста
появятся соответствующие теги. Другой способ - сначала
воспользоваться командой Markup д Insert Element и выбрать тег
в диалоговом окне ввода элементов. Если выбранный элемент
представляет собой контейнер, можно ввести текст между
открывающим и завершающим тегами.
Основным элементом является абзац. В отличие от
HTML 1.0, где требовалось наличие только одного тега в
конце абзаца, в HTML 3 этот элемент должен состоять из
открывающего тега <P>, текста, который должен появиться
на странице, и завершающего тега </P>. При просмотре
страницы в web-броузере после завершающего тега появится
пустая строка. Не стоит делать довольно распространенной
ошибки и вставлять дополнительные теги абзаца в надежде
увеличить вертикальное пространство - броузер не поймет этого
и добавит только одну пустую строку. В последующих разделах
описаны дополнительные способы работы с абзацами.
Абзацы заранее заданного формата Если вы хотите
создать блок текста, который должен отображаться в
web-броузере в том же виде, в котором он присутствует в
HTML-коде, (т.е. с тем же количеством пробелов, с таким же
разбиением на строки и т. д.), воспользуйтесь элементом,
который обеспечивает отображение предварительно
отформатированного текста. Такую возможность предоставляет тег
<PRE>. Для отображения текста этого элемента
web-броузеры используют шрифт с фиксированной шириной символов
(например, Courier) и делают переводы строки именно в тех
местах, где они находились в исходном тексте. Такая
возможность используется при необходимости включить в документ
текст программы, таблицу, вставить текстовый файл (например,
статью из новостей USENET), а также для добавления пустых
строк. Броузер исправно покажет любое количество переводов
строки, введенных между начальным тегом <PRE> и
завершающим </PRE>. Внутри этого элемента можно
использовать теги стилей шрифта и ссылки, однако нельзя
использовать теги, определяющие стиль абзацев, например,
заголовки. Длина строки в предварительно отформатированном
тексте не должна превышать 60-80 символов. Если строки будут
длиннее, то проблемы при их выводе на экран почти неизбежны.
Центрирование Одним из наиболее полезных
расширений, введенных в спецификации HTML фирмой Netscape,
является тег центрирования абзаца <CENTER>. Имейте в
виду, что это полноценный тег, а не атрибут. Тег
<CENTER>, примененный к абзацу или другому элементу
(например, заголовку или рисунку), центрирует его относительно
экрана броузера. Такая возможность присутствует во всех
текстовых процессорах, но не все web-броузеры поддерживают это
расширение. Тег <CENTER>, как и тег обычного абзаца,
приводит к появлению на экране пустой строки. Если броузер не
поддерживает этот тег, он не создаст и пустых строк в
соответствующих местах. Поэтому постарайтесь избежать
применения тега <CENTER> к заголовкам. Пользуйтесь для
их выделения стандартными тегами. Если же вы хотите создать
страницу специально для броузеров Netscape, то действуйте
смело - тег <CENTER> можно с успехом применять для
центрирования самых разных элементов.
Цитаты Еще один стиль абзаца применяется для
выделения текста, который берется из другого источника. Это
стиль для цитат, известный под названием <BLOCKQUOTE>.
Такой абзац обычно отображается в web-броузере с отступом
вправо, а некоторые броузеры применяют для выделения курсив.
Для выделения источника
цитаты использован тег <EM>, с которым вы познакомитесь
немного позже.
Списки В главе 5
мы уже немного рассказали о включении в web-страницу различных
списков. В последующих разделах приводится дополнительная
информация о четырех типах списков: неупорядоченных (unordered
lists), упорядоченных (ordered lists), списках каталогов
(directory lists), и дискурсивных списках (discursive lists).
Списки последнего типа также называют словарными списками
(glossary lists) или списками определений (definition lists).
Если необходимо добавить элемент в уже существующий список,
поместите курсор перед завершающим тегом списка и
воспользуйтесь командой Markup д Insert Element. В документ
будет автоматически добавлена пустая пара тегов элемента
списка.
Создание неупорядоченного списка
Элементы неупорядоченного списка могут
быть нескольких уровней вложенности. Уровни различаются
отступом от левого поля и вводными символами (bullets).
Элементы первого уровня отмечаются кружком (жирной точкой),
элементы второго уровня - окружностью, а последнего, третьего
уровня - квадратом. Неупорядоченный список начинается с тега
<UL>. Элементы списка создаются с помощью тега
<LI> (List Item), они могут состоять из нескольких строк
текста. Одной из разновидностей неупорядоченного списка
является меню. При использовании тега <MENU> вместо
<UL> список получается более компактным. Элемент меню
может занимать не более одной строки.
Компания Netscape ввела в HTML расширение TYPE,
предназначенное для управления типом вводного символа. Чтобы
использовать это расширение, поместите курсор между
открывающим и завершающим тегами нужного элемента списка и
выберите команду Markup д Edit SGML Attributes. Откроется
диалоговое окно редактирования атрибутов. В поле атрибута TYPE
введите значение disc (кружок), circle (окружность) или square
(квадрат). Хотя существует три варианта вводного элемента, при
просмотре страницы в Netscape для Windows кружок и окружность
практически не отличаются друг от друга. Действие атрибута
TYPE распространяется на все последующие элементы списка.
Чтобы изменить тип символа для списка в целом, нужно указывать
значение атрибута TYPE не в отдельных тегах <LI>, а в
самом элементе <UL>.
Это расширение, позволяя непосредственно контролировать вид
отображаемых вводных символов, отходит от принципа
«логического форматирования» и больше соответствует
«физическому форматированию». Кроме того, этот атрибут будет
работать только в броузерах фирмы Netscape. Например, Mosaic
может отображать вводные символы только в виде жирных точек.
Создание упорядоченного списка Упорядоченный (или
нумерованный) список состоит из элементов, в начале которых
стоит их порядковый номер. Упорядоченные списки создаются с
помощью тега <OL> (ordered list). По умолчанию элементы
списка нумеруются по возрастанию, то есть 1, 2, 3, 4,
и т. д. Нумерация элементов списка подразумевает, что
порядок их следования несет в себе определенное значение.
Фирмой Netscape введено расширение HTML, которое позволяет
обозначать элементы упорядоченного списка не просто цифрами 1,
2, 3 и т. д., а, например, заглавными или строчными
латинскими буквами, либо римскими цифрами в верхнем или нижнем
регистре. При просмотре таких списков в броузерах других фирм
нумерация опять превратится в цифровую. Поэтому в тексте
web-документа не стоит явно ссылаться, например, на «Пункт C»
или «Пункт II».
Чтобы применить к списку расширенную схему нумерации
Netscape, поместите курсор между открывающим и завершающим
тегами нужного элемента списка и выберите команду Markup д
Edit SGML Attributes. Откроется диалоговое окно редактирования
атрибутов, где в текстовое поле TYPE нужно ввести одно из
описанных в таблице 7.1 значений. Как и для стилей
вводных символов, действие атрибута TYPE распространяется на
все последующие элементы. При необходимости изменить стиль
нумерации во всем списке, следует установить нужное значение
атрибута TYPE для тега <OL>, а не для отдельных
элементов списка.
Таблица 7.1. Возможные значения атрибута TYPE для
упорядоченных списков
Значение Описание
A Текущий элемент списка и все последующие будут обозначать-
ся заглавными латинскими буквами.
a Текущий элемент списка и все последующие будут обозначать-
ся строчными латинскими буквами.
I Текущий элемент списка и все последующие будут обозначать-
ся большими римскими цифрами.
i Текущий элемент списка и все последующие будут обозначать-
ся маленькими римскими цифрами.
1 Текущий элемент списка и все последующие будут обозначать-
ся арабскими цифрами. Это значение установлено по
умолчанию
Ещё одно расширение
Netscape позволяет начать нумерацию элементов списка не с
единицы, а с другого произвольного значения. Номер, с которого
должна начинаться или продолжаться нумерация, необходимо
ввести в поле START диалогового окна редактирования атрибутов
тега <LI> (для отдельного элемента) или <OL> (для
списка в целом). Введенное значение будет номером текущего
элемента списка и началом отсчета для последующих. Атрибут
START не оказывает влияния на значение атрибута TYPE, то есть,
если ввести для атрибута START значение «3», то номер текущего
элемента списка может выглядеть как «C» (при TYPE=A), «c»
(TYPE=a), «III» (TYPE=I), «iii» (TYPE=i) или «3» (TYPE=1).
Создание списков каталогов Список каталогов
определен в стандарте как список, содержащий элементы длиной
не более 24 символов. Web-броузеры изображают его без вводных
символов и сдвига вправо, поэтому, если бы элемент списка имел
длину более 24 символов и его окончание переносилось на
следующую строку, было бы трудно понять, что новая строка
является продолжением предыдущего элемента.
Создание дискурсивных списков В дискурсивных
списках, которые также называют словарными списками или
списками определений, после каждого элемента следует
описательный абзац. Обычно такие списки используются для
словарей или списков терминов с их определениями. Дискурсивный
список начинается с тега <DL>. Каждый элемент списка
состоит из двух частей - обозначаемого тегом <DT>
термина (term) и его описания (definition), обозначаемого
тегом <DD>. Термин должен укладываться в одну строку,
описание может состоять из нескольких строк текста.
Для дискурсивных списков в стандарте описана опция COMPACT,
однако на момент написания этой книги все протестированные
броузеры игнорировали ее.
Создание вложенных списков Существует возможность
вложить один список в другой, вставив теги списка, например,
<UL> или <OL>, внутрь элемента списка <LI>.
Однако не рекомендуется делать вложенные списки с количеством
уровней больше трех. Следует иметь в виду, что различные
программы просмотра Web по-разному отображают вложенные списки
- они могут использовать разные вводные символы.
Добавление адреса Тег <ADDRESS>,
соответственно своему названию, используется для обозначения
блока текста, содержащего адрес. Как и многие другие теги
HTML, тег адреса интерпретируется различными броузерами
по-разному. В большинстве случаев адрес будет выведен
курсивом. Как упоминалось в пятой
главе, тег <ADDRESS> часто используется в комбинации
с тегом <BR> (перевод каретки), чтобы разместить
смысловые части адреса на разных строках.
Форматирование символов с помощью «логических»
стилей Логические стили определяют лишь род текста,
предоставляя конкретному броузеру выбрать, как отображать его
на экране. Для форматирования текста следует, где только
возможно, применять именно логические стили вместо
«физических». Теги логических стилей предпочтительнее,
поскольку они позволяют производить более интеллектуальную
обработку текста. Они также обеспечивают большую гибкость,
позволяя читателю документа в собственном броузере определить
правила отображения того или иного логического стиля. Наиболее
существенным недостатком логических стилей является, пожалуй,
то, что их слишком мало. Например, если в документе
присутствуют объемные, но не очень важные отрывки, имеет смысл
использовать для них самый мелкий шрифт. Для этого пригодился
бы соответствующий стиль, однако в HTML такого стиля не
определено. Возможность определения собственных стилей и
логических тегов присутствует в SGML, однако за это заплачено
большой сложностью языка, от которой HTML избавлен. Достаточно
сказать, что вопрос о том, какие стили лучше применять в
документах, до сих пор является предметом оживленных дискуссий
в web-сообществе.
Выделение текста В HTML существует два тега
выделения текста для привлечения к нему внимания - <EM>
и <STRONG>. В web-броузерах текст, выделенный тегами
<EM>, будет, как правило, отображаться курсивом, а
тегами <STRONG> - полужирным шрифтом.
Исходный код программ и примеры Для тех отрывков
документа, которые представляют собой текст программ или нечто
подобное, можно использовать тег <CODE>. Выделенный
этими тегами текст обычно отображается в web-броузерах
моноширинным шрифтом Courier. Размер этого шрифта, как
правило, может устанавливаться пользователем броузера
независимо от других логических стилей. Если нужно вывести в
таком виде целый абзац текста, тег <CODE> использовать
не стоит - это стиль символов, а не абзаца, то есть он не
генерирует переводов строки. Здесь больше подойдет тег
<PRE>.
Существуют и другие логические стили: <SAMP>, который
определен в стандарте как стиль для символьных констант;
<KBD>, служащий для обозначения текста, который
пользователь должен ввести с клавиатуры; <VAR>, который
предназначен для выделения названий переменных. Эти стили
наглядно демонстрируют тот факт, что авторами языка HTML были
пользователи компьютеров и программисты. Наконец, последний
определенный в стандарте логический стиль - это <CITE>,
которым выделяются цитаты и ссылки на названия. Этот стиль
обычно отображается курсивом.
Форматирование символов с помощью «физических»
стилей Вторая категория стилей форматирования символов
получила название физических стилей. Они дают web-броуеру
явные указания о том, как изображать тот или иной символ. С
помощью этих стилей можно задать полужирный шрифт, курсив,
подчеркивание, мигающий текст и шрифт с фиксированной шириной
символов. Примеры этих стилей (за исключением подчеркивания
текста)
В противоположность тегам форматирования абзацев,
использование тегов форматирования символов не переводит
строку в месте их вставки, поэтому можно применять несколько
стилей в одном и том же предложении. Теги форматирования
символов всегда присутствуют в виде пар из открывающего и
завершающего тега по краям текста, к которому должен быть
применен данный стиль. Например, выделенный текст должен
начинаться с тега <EM> и заканчиваться тегом
</EM>.
Выделение курсивом, подчеркиванием и полужирным
шрифтом Теги <B> (Bold), <I> (Italic) и
<U> (Underline) предназначены для выделения текста
соответственно полужирным шрифтом, курсивом и подчеркиванием.
Как обычно, текст, который необходимо отформатировать подобным
образом, должен находиться между открывающим и завершающим
тегами. В редакторе HoTMetaL PRO есть возможность сначала
ввести весь текст, затем вернуться назад и отформатировать
нужные отрывки соответствующим образом с помощью команды
Markup д Insert Element. Некоторое преимущество этого подхода
заключается в том, что он помогает избежать перенасыщения
страницы форматированным текстом.
По возможности используйте теги <STRONG> вместо
<B> и <EM> вместо <I>, если только у вас нет
настоятельной необходимости изобразить данный отрывок именно
полужирным шрифтом или курсивом. Если вы будете следовать
этому совету, ваш документ получится максимально переносимым и
универсальным.
Разумеется, может понадобиться явно определить особенности
форматирования участков текста именно на физическом уровне,
например, если необходимо описать примерно следующее:
«Полужирный текст относится к оригиналу документа, курсивом
выделены предлагаемые изменения». Однако и в таких случаях
имейте в виду, что не все программы просмотра Web поддерживают
физическое форматирование символов, поэтому стоит
предусмотреть либо альтернативный вариант выделения различных
участков текста, либо создать специальную страницу для
читателей, которые пользуются такими броузерами.
Форматирование текста подчеркиванием еще не признано в
качестве стандартного и пока не поддерживается в продуктах
Netscape. В наиболее профессионально подготовленных
публикациях подчеркнутый текст заменяется курсивом. Советуем и
вам делать то же самое. Выделению подчеркиванием не
соответствует никакой логический стиль, и если вы непременно
хотите выделить текст таким образом, вам придется вручную
ввести пару тегов <U> и </U>.
Мерцающий текст Одно из расширений, введенных
Netscape - тег <BLINK>. Текст, к которому применен этот
стиль, при просмотре страницы в броузере начинает мерцать. На
первый взгляд это может показаться интересным нововведением,
однако, подобно серии восклицательных знаков в конце
предложения, привлекает к себе излишнее внимание. Не стоит
использовать это расширение только ради его новизны. Вид
мигающих символов может так загипнотизировать читателя, что на
остальной текст он просто не обратит внимания. Если и стоит
использовать это расширение, то только в качестве самой
крайней меры. Кроме того, поскольку оно добавлено в
спецификации HTML фирмой Netscape, не ожидайте, что текст
замигает во всех web-броузерах. Впрочем, в большинстве своем
программы просмотра Web, если и не поддерживают этот тег, то
просто игнорируют его и отображают текст стандартным образом.
Изменение начертания и размера шрифта Размер
шрифта, которым отображается HTML-документ, определяется
установками конкретного web-броузера. Компания Netscape,
однако, решила, что возможность некоторого управления
относительным его размером не помешает. В результате возникли
два тега, с помощью которых можно контролировать величину
символов - <BASEFONT> и <FONT>. С помощью тега
<BASEFONT> можно определить относительный размер
основного шрифта для отрывка текста. Разрешается использовать
любые значения от 1 до 7. Число 3 представляет собой середину
диапазона регулировки и соответствует размеру шрифта по
умолчанию. Расширения Netscape также позволяют использовать
символы «плюс» (+) и «минус» (-) для относительного изменения
размера шрифта по сравнению с основным текстом.
Чтобы указать часть абзаца, в которой должен использоваться
моноширинный шрифт, например, в стиле пишущей машинки, можно
использовать тег <TT>. Обычно web-броузеры отображают
этот стиль шрифтом Courier. Если в подобном стиле необходимо
вывести целый абзац, следует использовать абзацный стиль
<PRE>.
Управление переводом строки Естественно, у вас
нет никакой возможности контролировать размер окна
web-броузера, в котором читатель просматривает HTML-документ.
Броузер размещает абзацы таким образом, чтобы максимально
использовать ширину окна просмотра. Если исключить
предварительно отформатированный текст, то невозможно
предсказать, как абзац будет разбит на строки. Однако иногда
необходимо обеспечить перевод строки в четко определенном
месте, либо выделить группы слов, которые обязательно должны
быть расположены на одной строке. Эти две возможности
предоставляются тегами <BR> и <NOBR>
соответственно.
Тег <BR> (break) заменяется при просмотре на перевод
строки. Открывающий и завершающий теги <NOBR> ставятся
по краям текста, который обязательно должен находиться на
одной строке. Последний тег является расширением Netscape, так
что он может действовать не во всех броузерах. Возможность
определять «неразрывный» текст полезна, например, для примеров
текста программ или командных строк. Кроме того, тег
<NOBR> может применяться для телефонных номеров или
текста гиперссылок, состоящих из нескольких слов, например,
«Virtual Tourist» (Виртуальный путешественник) или «Red Hot
Links» (Горяченькие ссылки). Эти примеры можно увидеть на
домашней странице компании Canyon Software. В дополнение к
тегу <NOBR> компания Netscape добавила еще один,
<WBR> (Word BReak - разбивка по словам). Этот тег
используется там, где можно разбивать текст, если это
понадобится при форматировании документа.
Специальные символы В HTML предусмотрена
возможность вводить в документ множество так называемых
«специальных» символов, которых нет в обычной американской
раскладке клавиатуры. Слово «специальные» помещено в кавычки,
потому что для многих создателей HTML-страниц эти символы
являются просто частью алфавита. Однако, из-за ограничений,
накладываемых традиционным 7-битным кодированием символов, для
их ввода в HTML-документы приходится принимать специальные
меры. В терминах HTML специальные символы называются
символьными объектами (character entities). В основном эти
символы представляют собой буквы с акцентами, обозначения
валют и знаки, имеющие специальное значение в языке HTML,
такие как кавычки ("), знаки «больше» (>) и «меньше»
(<), а также амперсанд (&).
Какие символы считаются специальными Большинство
знаков, присутствующих на клавиатуре в американской раскладке,
представляют собой обычные символы, для ввода которых в
HTML-документ не нужно применять никаких специальных мер. К
ним относятся все цифры и латинские буквы, а также наиболее
часто употребляемые знаки пунктуации. При работе в редакторе
HoTMetaL PRO ввод с клавиатуры некоторых специальных символов
автоматически вставляет в документ соответствующий HTML-код.
При редактировании исходного HTML-кода в обычном текстовом
редакторе имейте в виду, что специальные символы необходимо
вводить особым образом. В HTML определены специальные коды для
включения в текст символов, зарезервированных в языке. Эти
последовательности символов, приведенные в таблице ниже,
начинаются с амперсанда (&) и оканчиваются точкой с
запятой (;).
Символ Код
> >
< <
& &
" "
Будьте осторожны при использовании Microsoft Word для
Windows! Если вы планируете сохранить свой документ в формате
RTF и впоследствии конвертировать его в HTML, обязательно
отключите в меню Автокоррекция (AutoCorrect) опцию «Заменять
прямые кавычки на парные кавычки» (Change Straight Quotes to
Smart Quotes). Парные кавычки при преобразовании RTF в HTML
обрабатываются неправильно.
В набор специальных символов HTML входят все буквы с
акцентами, специальные знаки препинания и обозначения валют 1.
Полный список этих символов можно найти в Приложении. Редактор
HoTMetaL PRO позволяет вводить все специальные символы при
помощи последовательностей нажатий клавиш в виде Alt+0nnn, где
nnn - трехзначный цифровой код символа. Если введенный таким
образом символ имеет специальное представление в HTML,
HoTMetaL PRO заменит его соответствующим кодом. Если для
специального символа не назначен особый код, редактор вставит
тег символьного объекта с соответствующим номером символа. Еще
один способ вводить специальные символы при редактировании в
HoTMetaL PRO заключается в использовании команды Markup д
Special Characters.
При создании web-документа имейте в виду, что World Wide
Web представляет собой глобальную сеть, и для многих читателей
ваших страниц английский язык не является родным. Если есть
возможность создать многоязычный документ - непременно стоит
это сделать. Это привлечет к вашему web-узлу читателей из
разных стран и еще больше сплотит многонациональное сообщество
World Wide Web.
Полностью эту страницу можно найти в Web по адресу .
Горизонтальные разделители Специальные элементы,
такие как горизонтальные разделители и небольшие повторяющиеся
графические вставки, могут придать документу неповторимый шарм
и заодно помогут читателю сориентироваться в информации.
Горизонтальный разделитель, который создается в HTML при
помощи тега <HR>, часто используется для того, чтобы
визуально отделить одни элементы страницы от других. Это может
быть очень полезно для выделения разделов документа, тем
более, что HTML предоставляет не слишком много других
возможностей форматирования. В исходном HTML-коде
горизонтальный разделитель представляется в виде тега
<HR>, у которого нет завершающего тега (Внимание:
HoTMetal PRO при редактировании показывает значки и
начального, и конечного тега, однако в сохраненном HTML-тексте
будет присутствовать только открывающий тег). Компания
Netscape ввела в HTML возможность управлять длиной и толщиной
разделительной линии. Длина задается в процентах от ширины
отображаемой страницы. Таким образом можно получить прекрасный
результат при просмотре страницы в Netscape и совершенно
безобразный вид в другом броузере, поэтому используйте это
расширение с осторожностью.
Хотя рисунки в общем-то не предназначены для того, чтобы
разделять текст на части, нужно заметить, что и в этом
качестве некоторые из них могут пригодиться. Например, обычные
горизонтальные разделители можно заменить на встроенные
изображения. Помимо всего прочего, это намекнет читателю на
то, какую ширину окна просмотра документа стоило бы
установить. Графические элементы можно также использовать в
качестве навигационных панелей сверху или снизу страницы. Еще
несколько способов применения в HTML-документах изображений
описано в главе
8.
При использовании изображений в качестве панелей
управления, необходимо применять для работы с ними единый
шлюзовой интерфейс CGI (Common Gateway Interface), который
описан в главах 8
и 10.
Компания Netscape предложила четыре расширения HTML,
предназначенных для управления длиной, толщиной, выравниванием
и оттенением горизонтальных разделителей. С их помощью можно,
например, определить разделитель, который будет представлять
собой центрированную линию толщиной 1/4 дюйма, занимающую
половину ширины страницы. Однако, если какие-то элементы
хорошо выглядят в вашей программе просмотра, они вовсе не
обязаны выглядеть приемлемо в других броузерах. На рис. 7.20
показано окно редактирования атрибутов горизонтального
разделителя.
В таблице 7.2 описаны расширения
Netscape, с помощью которых можно управлять внешним видом
горизонтального разделителя. Хотя Netscape позволяет задавать
длину линии в процентах от ширины страницы, в HoTMetaL PRO эта
возможность отсутствует. Вместо этого необходимо указывать
длину линии в пикселах.
Таблица 7.2. Атрибуты горизонтального
разделителя
<HR SIZE=n> Определяет толщину горизонтальной линии в
пикселях. Вместо n указывается количество
пикселей.
<HR WIDTH=n> Определяет точную длину линии в пикселях,
либо относительную - в процентах от ширины
окна документа. Вместо n указывается коли-
чество пикселей.
<HR ALIGN=alignment> Определяет выравнивание разделителя.
Вместо переменной alignment можно под-
ставлять три значения - LEFT (выравнивание
влево), RIGHT (выравнивание вправо) или
CENTER (центрирование).
<HR NOSHADE> Указывает на то, что у разделителя не должно
быть оттенения.
Таблицы Возможность создавать таблицы появилась в
языке HTML совсем недавно и не входит в стандарт текущей
версии (HTML 2). Однако уже сейчас можно создавать
таблицы в HoTMetaL PRO и просматривать их в броузерах Netscape
Navigator и NCSA Mosaic. Следует иметь в виду, что
HTML-таблицы еще не вышли из экспериментальной стадии, и теги
разметки таблиц могут еще не раз измениться. Разумеется,
различные броузеры по-разному отображают таблицы, так что не
удивляйтесь, если вдруг увидите не совсем то, что создали в
HoTMetaL PRO. Это не является недостатком HoTMetaL PRO или
броузера - просто часто таковы последствия работы с не вполне
стандартными средствами.
Включение таблицы в документ Таблицы часто
применяются в технических публикациях, поэтому с наибольшей
радостью восприняли новость об их поддержке в HTML те, кому
необходимо было создать HTML-версии уже существующих
документов такого рода. Чтобы проиллюстрировать создание
HTML-таблиц, в этом разделе показано, как с помощью HoTMetaL
PRO вводить их элементы. Мы рассмотрим три простых примера.
Приведенная ниже последовательность действий в редакторе
HoTMetaL PRO обеспечивает создание таблицы с рамкой и
заголовком.
1. Поместите точку вставки в основной части web-страницы и
выберите команду Markup д Insert Element или нажмите клавиши
Ctrl+I. Откроется диалоговое окно вставки элемента.
2. Выделите элемент таблицы (Table) и щелкните на кнопке
Insert Element. Откроется диалоговое
окно вставки таблицы.
3. Укажите количество столбцов таблицы в поле Columns, а
количество строк - в поле Rows. Щелкните на кнопке Insert. В
документе появится сетка,
4. Щелкните кнопкой мыши справа от открывающего тега
<TABLE> и выберите команду Markup д Edit SGML
Attributes, или нажмите клавишу F6. Откроется диалоговое окно
редактирования атрибутов.
5. Введите число, которое будет обозначать толщину рамки
таблицы в пикселях, в поле Border и щелкните на кнопке Apply.
6. Выберите команду Markup д Insert Element или нажмите
клавиши Ctrl+I. Откроется диалоговое окно вставки элемента.
7. Для создания заголовка таблицы выберите в списке
элементов пункт Caption и щелкните на кнопке Insert Element.
Точка вставки появится между открывающим и завершающим тегами
<CAPTION>.
8. Введите заголовок, который будет располагаться над
таблицей.
Редактирование таблицы После того как вы вставите
в документ таблицу и поместите курсор внутри нее, в меню
Markup станут доступны четыре команды редактирования,
описанные в таблице 7.3.
Таблица 7.3. Команды редактирования таблиц
Команда Описание
Cell Properties Открывает диалоговое окно редактирования
(Параметры ячейки) параметров ячейки таблицы,
. В этом окне можно выбрать из списка
списка Vertical Alignment тип вертикального вы-
выравнивания текста в ячейке - TOP (вверх),
MIDDLE (по центру) или BOTTOM (вниз), а в
списке Horizontal Alignment - горизонтальное
выравнивание - LEFT (влево), RIGHT (вправо),
CENTER (центрирование) или JUSTIFY (выравни-
вание краев). Ширина столбца зависит от само-
го большого значения, введенного в поле Width,
или автоматически рассчитывается броузером.
Row Properties Открывает диалоговое окно редактирования пара-
(Параметры строки) метров строки, В этом
окне можно задать вертикальное и горизонталь-
ное выравнивание для всех ячеек данной строки
таблицы.
Edit Table Открывает диалоговое окно редактирования
(Редактировать таблицу) таблицы, В этом окне
расположены кнопки, которые позволяют вста-
вить в таблицу новую строку над или под теку-
щей строкой, или вставить новый столбец слева
или справа от текущего столбца. Можно также
удалить строку или столбец. Помимо этого, мож-
но объединить ячейки в любом направлении при
помощи кнопок Expand и Contract. Если за-
держать указатель мыши над какой-либо кноп-
кой, всплывет подсказка о ее назначении.
Примеры таблиц Броузеры Netscape и Mosaic
поддерживают таблицы и могут отображать их с трехмерными
рамками. В приведенном ниже примере показаны возможности
использования тегов разметки таблиц в HoTMetaL PRO.
В таблице 7.4. перечислены и описаны теги,
использованные в данном примере.
В последнем, третьем примере в предыдущую таблицу внесены
последние штрихи: центрирование, размещение заголовка внизу,
широкая рамка, более просторные и раздвинутые ячейки.
Тег Описание
<TABLE></TABLE> Открывающий (<TABLE>) и завершающий
(</TABLE>) теги таблицы. Если определено значе-
ние атрибута BORDER, как в предыдущих приме-
рах, броузер Mosaic выводит таблицу с обрамле-
нием. Компания Netscape добавила в тег
таблицы три атрибута: CELLSPACING,
CELLPADDING и WIDTH.
Атрибут CELLSPACING позволяет указать расстоя-
ние между ячейками в таблице. Атрибут
CELLPADDING управляет расстоянием между гра-
ницей ячейки и ее содержимым. Атрибут WIDTH
определяет ширину таблицы в пикселях. При ис-
пользовании в тегах <TH> и <TD> атрибут WIDTH
позволяет указать ширину ячейки.
<CAPTION> </CAPTION> Предназначен для ввода заголовка или названия
таблицы. Название таблицы в первом примере -
«Sales Figures for 1995» («Объемы продаж в 1995
году»). Атрибут ALIGN=BOTTOM позволяет распо-
ложить название под таблицей.
