Тег <CAPTION> позволяет создавать заголовки таблицы

…..

<td> ячейка n, 1-строки </td>

</tr>

<tr>

<td>ячейка 1,2-строки </td>

…..

<td> ячейка n, 2-строки </td>

</tr>

…

</table>

Атрибуты тега:

¨ align="left | center | right | justify" – Задает выравнивание содержимого ячейки по горизонтали.

¨ valign="top | middle | bottom | baseline" – Устанавливает вертикальное выравнивание содержимого ячейки.

¨ background="URL" – Определяет изображение, которое будет использоваться в качестве фонового рисунка таблицы.

¨ bgcolor="цвет" – Устанавливает цвет фона ячейки.

¨ bordercolor="цвет" – Устанавливает цвет рамки вокруг ячейки.

¨ colspan="число" – Устанавливает число ячеек, которые должны быть объединены по горизонтали.

¨ rowspan="число" – Устанавливает число ячеек, которые должны быть объединены по вертикали.

¨ height="значение" – Браузер сам устанавливает высоту таблицы и ее ячеек исходя из их содержимого. Однако при использовании параметра height высота ячеек будет изменена. Здесь возможны два варианта. Если значение height меньше, чем содержимое ячейки, то этот параметр будет проигнорирован.

В случае, когда установлена высота ячейки, превышающая ее содержимое, добавляется пустое пространство по вертикали

¨ width="значение" – Задает ширину ячейки. Если общая ширина содержимого превышает указанную ширину ячейки, то браузер будет пытаться «втиснуться» в заданные размеры за счет форматирования текста. В случае, когда это невозможно, например, в ячейке находятся изображения, параметр width будет проигнорирован, и новая ширина ячейки будет вычислена на основе ее содержимого.

Заголовки столбцов таблицы - тег <ТН>

теги подобны <ТD></ТD>. Отличие состоит в том, что текст, заключенный между тегами <ТН></ТН>, автоматически записывается жирным шрифтом и по умолчанию располагается посередине ячейки.

Тег <CAPTION> позволяет создавать заголовки таблицы.

Заголовок центрируются и размещаются либо над (<САРТION АLIGN=top>),

либо под таблицей (<САРТION ALIGN=bottom>).

Заголовок может состоять из любого текста и изображений.

<TABLE BORDER> <CAPTION ALIGN=top> Заголовок над таблицей </CAPTION> Пример:

Задать таблицу с синим фоном. Для первой строки установить золотой цвет.

<table bgcolor="blue" width="30%"> <tr bgcolor="#ffcc00"> <td> ячейка 1 </td> </tr> <tr> <td> ячейка 2 </td> </tr> </table>

Пример горизонтального объединение ячеек

<table width="200" border="1" cellpadding="4" cellspacing="0"> <tr> <td colspan="2">Ячейка 1</td> </tr> <tr> <td>Ячейка 2</td> <td>Ячейка 3</td> </tr> </table>

ячейка 1
ячейка 2	ячейка 3

Пример использования вертикального объединения ячеек

ячейка 1	ячейка 2
ячейка 3

<table width="200" border="1" align="center" cellpadding="4" cellspacing="0"> <tr> <td rowspan="2" bgcolor="#FBF0DB"> Ячейка 1</td> <td>Ячейка 2</td> </tr> <tr> <td>Ячейка 3</td> </tr> </table >

Пример 3.5:

Задать таблицу шириной 250 пикселей. Для первой строки первая ячейка выравнивание по центру, для второй по правому краю, вторая строка – все ячейки по правому краю, последняя по левому.

<table width=”250” border=”1”> <tr> <td align=”center”>Ячейка 1</td> <td align=”right”>Ячейка 2</td> </tr> <tr align=”right”> <td>Ячейка 3</td> <td align=”left”>Ячейка 4</td> </tr >

Пример: Задать таблицу в которой одна ячейка с фоновым рисунком, а другая без.

<table> <tr> <td background="fon.jpg">Ячейка с фоновым рисунком</td> <td>Ячейка без фона</td> </tr> </table> </table>

Пример:

Задать таблицу следующего вида.

<table border="1">
<tr>
<td rowspan="3" >строка1 ячейка1</td>
<td>строка1 ячейка2</td>
<td>строка1 ячейка3</td>
</tr>
<tr>
<td>строка2 ячейка2</td>
<td>строка2 ячейка3</td>
</tr>
<tr>
<td colspan="2">строка3 ячейка2</td>
</tr>
</table>

Пример:

Задать таблицу следующего вида.

Пара	День
Понедельник	Вторник
8:00-9:30	Пение	Рисование
Информатика	Математика
9:40-11:10	Философия	История
Физика	Химия

<table width="75%" border="2" cellspacing="0" cols="3" bgcolor="gold" align="center" bordercolor="black" > <tr align="center"> <td rowspan="2">Пара</td> <td colspan="2">День</td> </tr> <tr align="center"> <td>Понедельник</td> <td>Вторник</td> </tr> <tr> <td rowspan="2" bgcolor="red">8:00-9:30 </td> <td>Пение</td> <td>Рисование</td> </tr> <tr> <td>Информатика</td> <td>Математика</td> </tr> <tr> <td rowspan="2" bgcolor="red">9:40-11:10</td> <td>Философия</td> <td>История</td> </tr> <tr> <td>Физика</td> <td>Химия</td> </tr> </table>