с результатом отображения файла, приведенного
Рисунок 1.27. Окно браузера с результатом отображения файла, приведенного в листинге 1.28
Из листинга легко увидеть, что содержимым всех рассматриваемых нами структурных частей таблицы по-прежнему являются строки, составляющиеся, в свою очередь, из отдельных ячеек.
Как видно, несмотря на кардинально изменившуюся структуру таблицы в коде HTML-документа, при отображении ничего принципиально нового не появилось. И это правильно, так как HTML старается передавать конкретные аспекты отображения на более низкий, более детальный уровень иерархии объектов, т. е. если мы хотим, чтобы ячейки подвала, заголовка и тела таблицы отличались друг от друга по оформлению, мы должны либо самостоятельно установить эти правила отображения для каждой ячейки, либо воспользоваться стилевым оформлением.
Тем не менее, одно средство оформления все-таки встроено в эти теги. При помощи параметров align и valign мы можем устанавливать выравнивание содержимого ячеек. Параметр align задает выравнивание содержимого ячеек данного раздела таблицы по горизонтали. В качестве значения данного параметра применяется одно из предустановленных ключевых слов. Рассмотрим их.
- Значение left прижимает текст и иное содержимое ячеек к левому краю ячейки. Применяется по умолчанию для основного раздела таблицы.
- Значение right выравнивает любое содержимое ячеек по правому краю.
- Значение center центрирует содержание ячеек, включенных в раздел, к которому и применяется данный параметр. Используется по умолчанию для заголовков таблицы.
- Значение justify заставляет браузер попытаться отобразить содержимое ячеек, равномерно растянув их по всей ширине ячейки.
- Значение char применяется в том случае, если в ячейках раздела отображается численная информация в финансовом формате, и необходимо выровнять ее не просто по левому или правому краю, а так, чтобы разделители целой и десятичной частей всех чисел находились на одном и том же уровне.
Теперь перейдем к параметру, позволяющему явно устанавливать вертикальное выравнивание содержимого ячеек, входящих в состав какого-либо блока таблицы. Он носит наименование vaiign. Как и параметр горизонтального выравнивания, он в качестве значения может использовать только одно ключевое слово из заранее предопределенного набора.
- Значение top прижимает содержимое ячеек к их верхним границам.
- Значение middle центрирует по вертикали содержимое ячеек, входящих в объявляемый блок. Данное значение используется по умолчанию.
- Значение bottom прижимает содержимое ячеек к их нижним граням.
- Значение baseline имеет смысл применять только для ячеек с текстовым содержимым. В этом случае, базовые линии первых строк текстового содержимого ячеек, входящих в объявляемый раздел таблицы, выравниваются по базовой линии первой строки текста содержимого первой ячейки во всей строке. Напомню, что базовой линией текста называется невидимая линия, на которой и располагаются основания большинства символов применяемого алфавита. Но у некоторых символов, таких как "g" в латинском алфавите, или "р" — в русском, существуют так называемые "хвостики", которые уходят вниз за базовую линию.
Следует осознавать, что если мы используем эти теги объявления столбцов, то количество столбцов в таблице будет рассчитываться именно на их основе, т. е. нам необходимо каждый столбец описать подобным образом, а не какую-либо их группу. Браузер при отображении таблицы сначала анализирует ее объявление на предмет нахождения тегов, создающих столбцы. Если они есть, то количество столбцов в таблице рассчитывается на их основе. Если таких тегов нет, то количество столбцов рассчитывается исходя из количества ячеек в строках.
При помощи тега <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 позволяет задавать цвет фона для ячеек, входящих в строку.