Основы создания HTML-документа

Таблицы

До настоящего времени мы имели дело с документами, в которых существовал только один "поток" текста. Самые первые странички так и выглядели, как текст с заголовками (а потом и с картинками) просто сверху вниз. Таблицы превратили это скромное зрелище в полный сверкающего многообразия мир, хотя поначалу задумывались совсем для иных, сугубо утилитарных задач. Суть метода заключается в следующем: на страничке создается таблица с невидимыми границами ячеек, и элементы, требующие точного позиционирования, располагаются в ячейках таблицы. Для каждой из ячеек вы можете указать собственные параметры форматирования, соответственно команды форматирования действуют только в пределах ячейки. На практике иногда очень хочется расположить текст в несколько колонок. Таблица может в этом помочь. Кроме того, таблица, состоящая из одной ячейки, может очень эффектно выделить фрагмент текста, на который Вы хотите обратить внимание читателя. Некоторым их достаточно активным аналогом могут служить фреймы

Таблица начинается с метки <TABLE> и заканчивается меткой </TABLE>.

                <TABLE>

                        <! описание таблицы >

                </TABLE>

Метка <TABLE> может включать несколько атрибутов:

ALIGN	Устанавливает расположение таблицы по отношению к полям документа. Допустимые значения: ALIGN=LEFT (выравнивание влево), ALIGN=CENTER (выравнивание по центру), ALIGN=RIGHT (выравнивание вправо).
WIDTH	Определяет ширину всей таблицы в пикселах(например, WIDTH=400), либо в процентах от ширины окна браузера(например, WIDTH=80%).
HEIGHT	Определяет высоту всей таблицы в пикселах, либо в процентах от высоты окна браузера.
BORDER	Устанавливает ширину рамки таблицы в пикселях, например, BORDER=2. Если атрибут не установлен, таблица показывается без рамки.
CELLSPACING	Устанавливает расстояние между рамками ячеек таблицы в пикселах (например, CELLSPACING=2).
CELLPADDING	Устанавливает расстояние между рамкой ячейки и текстом в пикселах (например, CELLPADDING=10).
bgcolor	параметр, управляющий цветом таблицы. Задается в формате RGB.
background=image.jpg	параметр, управляющий картинкой-подложкой таблицы. image.jpg - имя картинки.

Заголовок таблицы (caption)

Таблица может иметь заголовок, хотя заголовок не является обязательным. Заголовок таблицы помещается между маркерами <CAPTION> и </CAPTION>. Метка <CAPTION> может включать атрибут ALIGN. Допустимые значения:

<ALIGN=TOP> (заголовок помещается над таблицей) и <CAPTION ALIGN=BOTTOM> (заголовок помещается под таблицей).

Например:

                <TABLE ALIGN="center" BORDER=1>

                   <CAPTION>

                      Заголовок

                   </CAPTION>

                   <! ...описание строк таблицы... >

                </TABLE>

Строки таблицы (table rows)

Каждая строка таблицы начинается с метки <TR> и заканчивается меткой </TR>.

                <TABLE>

                   <TR> <! ...описание ячеек 1-й строки... > </TR>

                   <TR> <! ...описание ячеек 2-й строки... > </TR>

                   <TR> <! ...описание ячеек 3-й строки... > </TR>

                </TABLE>

Метка <TR> может включать несколько атрибутов:

ALIGN	Устанавливает выравнивание текста в ячейках строки. Допустимые значения: ALIGN=LEFT (выравнивание влево), ALIGN=CENTER (выравнивание по центру), ALIGN=RIGHT (выравнивание вправо).
VALIGN	Устанавливает вертикальное выравнивание текста в ячейках строки. Допустимые значения: VALIGN=TOP (выравнивание по верхнему краю), VALIGN=MIDDLE (выравнивание по центру), VALIGN=BOTTOM (выравнивание по нижнему краю).
bgcolor	Параметр, управляющий цветом таблицы. Задается в формате RGB.
background	параметр, управляющий картинкой-подложкой таблицы.

Ячейки таблицы

Каждая строка таблицы состоит из заголовочных ячеек, заключаемых в маркеры <TH> и </TH> или ячеек данных, обрамляемых маркерами <TD> и </TD>. Вот так выглядит типичная таблица из 3-х строк (из них первая - заголовочная) и 4-х колонок:

<TABLE>

<TR><TH>One</TH><TH>Two</TH><TH>Three</TH><TH>Four</TH></TR>

<TR><TD>1.1</TD><TD>1.2</TD><TD>1.3  </TD><TD>1.4 </TD></TR>

<TR><TD>2.1</TD><TD>2.2</TD><TD>2.3  </TD><TD>2.4 </TD></TR>

</TABLE>

One	Two	Three	Four
1.1	1.2	1.3	1.4
2.1	2.2	2.3	2.4

Метка <TD> может включать следующие атрибуты:

NOWRAP	Присутствие этого атрибута означает, что содержимое ячейки должно быть показано в одну строку.
COLSPAN	Устанавливает "размах" ячейки по горизонтали. Например, COLSPAN=3 означает, что ячейка простирается на три колонки.
ROWSPAN	Устанавливает "размах" ячейки по вертикали. Например, ROWSPAN=2 означает, что ячейка занимает две строки.
ALIGN	Устанавливает выравнивание текста в ячейке. Допустимые значения: ALIGN=LEFT (выравнивание влево), ALIGN=CENTER (выравнивание по центру), ALIGN=RIGHT (выравнивание вправо).
VALIGN	Устанавливает вертикальное выравнивание текста в ячейке. Допустимые значения: VALIGN=TOP (выравнивание по верхнему краю), VALIGN=MIDDLE (выравнивание по центру), VALIGN=BOTTOM (выравнивание по нижнему краю).
WIDTH	Устанавливает ширину ячейки в пикселах (например, WIDTH=200).
HEIGHT	Устанавливает высоту ячейки в пикселах (например, HEIGHT=40).