Пакет Adobe GoLive


Окно браузера с результатом отображения файла приведенного в листинге 1 28



Рисунок 1.27. Окно браузера с результатом отображения файла, приведенного в листинге 1.28




Из листинга легко увидеть, что содержимым всех рассматриваемых нами структурных частей таблицы по-прежнему являются строки, составляющиеся, в свою очередь, из отдельных ячеек.
Как видно, несмотря на кардинально изменившуюся структуру таблицы в коде HTML-документа, при отображении ничего принципиально нового не появилось. И это правильно, так как HTML старается передавать конкретные аспекты отображения на более низкий, более детальный уровень иерархии объектов, т. е. если мы хотим, чтобы ячейки подвала, заголовка и тела таблицы отличались друг от друга по оформлению, мы должны либо самостоятельно установить эти правила отображения для каждой ячейки, либо воспользоваться стилевым оформлением.
Тем не менее, одно средство оформления все-таки встроено в эти теги. При помощи параметров align и valign мы можем устанавливать выравнивание содержимого ячеек. Параметр align задает выравнивание содержимого ячеек данного раздела таблицы по горизонтали. В качестве значения данного параметра применяется одно из предустановленных ключевых слов. Рассмотрим их.

  • Значение left прижимает текст и иное содержимое ячеек к левому краю ячейки. Применяется по умолчанию для основного раздела таблицы.
  • Значение right выравнивает любое содержимое ячеек по правому краю.
  • Значение center центрирует содержание ячеек, включенных в раздел, к которому и применяется данный параметр. Используется по умолчанию для заголовков таблицы.
  • Значение justify заставляет браузер попытаться отобразить содержимое ячеек, равномерно растянув их по всей ширине ячейки.
  • Значение char применяется в том случае, если в ячейках раздела отображается численная информация в финансовом формате, и необходимо выровнять ее не просто по левому или правому краю, а так, чтобы разделители целой и десятичной частей всех чисел находились на одном и том же уровне.

О последнем случае вообще стоит поговорить особо. Мы сказали, что выравниваться будут не столько сами числа, сколько их десятичные разделители. А какие символы будут считаться десятичными разделителями? Если для всего документа явно установлен язык текстового содержимого, то браузер сам поймет, какой символ считается десятичным разделителем. Но нет никакой гарантии, что мы для этих целей будем использовать именно тот символ, который распознается браузером. Поэтому у нас есть возможность самостоятельно явно указать, какой символ мы применяем для разделения целой и дробной частей чисел. Для этих целей используется параметр char, значением которого и является данный символ. К сожалению, данную возможность стандарта HTML поддерживают далеко не все браузеры.
Теперь перейдем к параметру, позволяющему явно устанавливать вертикальное выравнивание содержимого ячеек, входящих в состав какого-либо блока таблицы. Он носит наименование vaiign. Как и параметр горизонтального выравнивания, он в качестве значения может использовать только одно ключевое слово из заранее предопределенного набора.

  • Значение top прижимает содержимое ячеек к их верхним границам.
  • Значение middle центрирует по вертикали содержимое ячеек, входящих в объявляемый блок. Данное значение используется по умолчанию.
  • Значение bottom прижимает содержимое ячеек к их нижним граням.
  • Значение baseline имеет смысл применять только для ячеек с текстовым содержимым. В этом случае, базовые линии первых строк текстового содержимого ячеек, входящих в объявляемый раздел таблицы, выравниваются по базовой линии первой строки текста содержимого первой ячейки во всей строке. Напомню, что базовой линией текста называется невидимая линия, на которой и располагаются основания большинства символов применяемого алфавита. Но у некоторых символов, таких как "g" в латинском алфавите, или "р" — в русском, существуют так называемые "хвостики", которые уходят вниз за базовую линию.

При помощи рассмотренных нами блоков таблицы, мы можем структурировать ее содержимое и немного управлять отображением содержимого ячеек, входящих в эти блоки. Но что делать, если нам необходимо установить единые правила оформления для одного или нескольких столбцов таблицы? Как мы знаем, нам нет нужды объявлять их специально, так как столбцы монтируются из ячеек, входящих в строки. Но, тем не менее, в стандарте HTML 4.1 существуют теги, которые позволяют объявлять отдельные столбцы и их группы. Для объявления одного столбца используется тег <col>, а если нам необходимо несколько столбцов объединить в одну группу, лучше использовать тег <coigroup>.
Следует осознавать, что если мы используем эти теги объявления столбцов, то количество столбцов в таблице будет рассчитываться именно на их основе, т. е. нам необходимо каждый столбец описать подобным образом, а не какую-либо их группу. Браузер при отображении таблицы сначала анализирует ее объявление на предмет нахождения тегов, создающих столбцы. Если они есть, то количество столбцов в таблице рассчитывается на их основе. Если таких тегов нет, то количество столбцов рассчитывается исходя из количества ячеек в строках.
При помощи тега <colgroup> мы объявляем группу столбцов. Каждый столбец этой группы мы можем дополнительно явно объявить при помощи тега <col>, но это не обязательно делать, если столбцы имеют одинаковое оформление. Оформление группы столбцов задается при помощи параметров тега<colgroup> . К этому тегу применимы параметры align и vaiign, которые мы рассматривали чуть ранее, с теми же возможными значениями. Помимо этого чаще всего применяется еще два параметра.

  • Параметр span показывает, какое количество столбцов будет находиться в данной группе. Значением данного параметра является положительное целое число. По умолчанию используется единичное значение, т. е. в группу по умолчанию входит всего один столбец.
  • Параметр width позволяет устанавливать единую ширину для всех столбцов, входящих в данную группу. Мы можем устанавливать точное абсолютное значение в пикселах, процентное соотношение или "кратные размеры", как мы описывали их в одном из предыдущих разделов данной главы. Так, если мы хотим, чтобы каждый столбец устанавливал ширину минимально необходимую, чтобы вместить содержимое ячеек, следует использовать конструкцию width="0*".

Так, если мы хотим указать, что в таблице будет сорок столбцов, каждый шириной в двадцать пикселов, следует использовать следующий фрагмент кода:

<colgroup span="40" width=*H20"> </colgroup>

Только никогда не следует забывать о том, что нам никогда заранее неизвестно, какое разрешение экрана будет у пользователя, загружающего нашу Web-страницу.
Отдельный столбец, входящий в группу, объявляется при помощи тега <col>. Этот тег обладает тем же .набором параметров, что и рассмотренный нами только что тег <colgroup>. Вот только параметр span здесь имеет несколько иное значение. Как мы знаем, некоторые ячейки, могут объединять сразу несколько ячеек из соседних столбцов. А теги <col> могут создавать столбцы, которые на самом деле будут состоять из нескольких столбцов, т. е. одна ячейка такого столбца может состоять из нескольких тегов <td>. Значение параметра span как раз и указывает, сколько именно столбцов будут объединяться в одном. Приведем пример использования данного параметра.
Если нам необходимо создать таблицу с тремя столбцами, стоит в код HTML-документа вставить следующую конструкцию:

<table>
<colgroup> <col>
<col span="2"> </colgroup>
<tr>
<td> .. . ...Определение строк...
</table>

Между тегами <colgroup> и </colgroup> мы вставили два тега <col>. Легко заметить, что это просто объявляющие теги, которые не требуют использования закрывающей пары для себя. В данном фрагменте мы создали таблицу с тремя столбцами. Первый столбец объявлен при помощи первого тега <col>, а вторые два столбца объединены в единую группу при помощи второго тега <col> с параметром span, значение которого установлено в "два".
Мы знаем, как объявлять столбцы. Но после объявления столбцов мы все равно переходим к заполнению таблицы, и там уже без тегов, создающих строки, не обойтись. Из предыдущих примеров мы видели, что строки создаются при помощи пары тегов <tr> и </tr>, между которыми находятся теги, объявляющие отдельные ячейки. Тег <tr>, естественно, обладает целым рядом параметров, которые, тем не менее, нам уже знакомы. Помимо всеобщих параметров идентификации, есть и параметры, регулирующие отображение информации, находящейся в ячейках, входящих в данную строку. Перечислим их.

  • Параметр align позволяет регулировать горизонтальное выравнивание содержимого ячеек строки.
  • Параметр vaiign задает вертикальное выравнивание для содержимого ячеек строки.
  • Параметр bgcolor позволяет задавать цвет фона для ячеек, входящих в строку.

Сами ячейки мы можем создавать не только при помощи тега <td>, но и при помощи тега <th>. Тег <th> предназначен для создания ячеек верхних строк таблицы, которые содержат наименования столбцов. В следующем листинге показан пример их использования (Рисунок 1.28).









Начало  Назад  Вперед


Книжный магазин