Посмотрите на таблицу:

 ЯнварьФевраль
 РасходПриходРасходПриход
Морковь 25 32 22 27
Картошка 38 35 51 16

В первой строке клетка «Январь» растянулась на два столбца, клетка «Февраль» так же.

Для объединения клеток столбцов таблицы нужно набрать:
1. В той позиции, в которой должна быть растянувшаяся клетка:
<TH или <TD
в зависимости от того, что нужно создать клетку заголовка или клетку данных.
2. COLSPAN=n>
где n – количество столбцов, которые должна охватить клетка.
[3]. Текст клетки.
4. </TH>или </TD>.
5. Остальной код таблицы. Если n равно 2, то в этой строке клеток должно быть на одну меньше. Если n равно 3, то в этой строке клеток должно быть на две меньше, и т.д.

Код вышеприведенной таблицы:

<TABLE BORDER="1"> 
<TR>
<TH><BR></TH>
<TH COLSPAN="2">Январь</TH>
<TH COLSPAN="2">Февраль</TH>
</TR>
<TR>
<TH><BR></TH>
<TH>Расход</TH><TH>Приход</TH>
<TH>Расход</TH><TH>Приход</TH>
</TR>
<TR>
<TH>Морковь</TH>
<TD>25</TD> <TD>32</TD> <TD>22</T> <TD>27</TD>
</TR>
<TR>
<TH>Картошка</TH>
<TD>38</TD> <TD>35</TD> <TD>51</TD> <TD>16</TD>
</TR>
</TABLE>

Посмотрите на эту таблицу и сравните её с приведенной выше:

 ЯнварьФевраль
РасходПриходРасходПриход
Морковь 25 32 22 27
Картошка 38 35 51 16

В первой строке первая клетка растянулась на две строки.

Для объединения клеток строк таблицы нужно набрать:
1. В той позиции, в которой должна быть растянувшаяся клетка:
<TH или <TD
в зависимости от того, что нужно создать клетку заголовка или клетку данных.
2. ROWSPAN=n>
где n – количество строк, которые должна охватить клетка.
[3]. Текст клетки.
4. </TH>или </TD>.
5. Остальной код таблицы. Если n равно 2, то в следующей строке клеток должно быть на одну меньше. Если n равно 3, то в следующих двух строках клеток должно быть на две меньше, и т.д.

Код вышеприведенной таблицы:

<TABLE BORDER="1"> 
<TR>
<TH ROWSPAN="2"><BR></TH>
<TH COLSPAN="2">Январь</TH>
<TH COLSPAN="2">Февраль</TH>
</TR>
<TR>
<TH>Приход</TH> <TH>Расход</TH>
<TH>Приход</TH> <TH>Расход</TH>
</TR>
<TR>
<TH>Морковь</TH>
<TD>25</TD> <TD>32</TD> <TD>22</T> <TD>27</TD>
</TR>
<TR>
<TH>Картошка</TH>
<TD>38</TD> <TD>35</TD> <TD>51</TD> <TD>16</TD>
</TR>
</TABLE>

Высота и ширина таблиц, которые мы создавали до этого момента, определялись автоматически. Высота и ширина таблиц можно задать явно в пикселях или процентах.

Для задания ширины и высоты таблицы или клетки нужно набрать:
1. В теге <TABLE>, <TH> или <TD> перед символом >:
WIDTH=x, HEIGHT=y
где x - ширина и y - высота в пикселях или в процентах относительно доступного пространства в экране.

Если заданные высота и ширина недостаточны для вывода данных, размещенных в клетке, то, обычно, высота и ширина игнорируются.

Для выравнивания таблицы по центру нужно набрать:
1. В теге <TABLE перед символом >:
ALIGN="center".

Для горизонтального выравнивания текста в клетке нужно набрать:
1. В теге <TR>, <TH> или <TD> перед символом >:
ALIGN=d, где d=left, right, center или justify.

Для вертикального выравнивания текста в клетке нужно набрать:
1. В теге <TR>, <TH> или <TD> перед символом >:
VALIGN=d, где d=top, middle, bottom или baseline.

Для размещения картинки на фоне таблицы, строки или клетки:
1. В теге <TABLE>, <TR>, <TH> или <TD> перед символом >:
BACKGROUND="image.ext", где image.ext - путь, имя и расширение файла картинки.

Для установки запрета на перенос слов в клетке нужно набрать:
1. В теге <TH> или <TD> перед символом >:
NOWRAP.

Посмотрите на таблицу:

 ЯнварФеврал
ХарочотДаромадХарочотДаромад
Сабзи 25 32 22 27
Картошка 38 35 51 16

Для установки промежутка между клетками таблицы нужно набрать:
1. В теге <TABLE> перед символом >:
CELLSPACING="n", где n - длина промежутка в пикселях.

Сравните следующую таблицу с вышеприведенной:

 ЯнварьФевраль
РасходПриходРасходПриход
Морковь 25 32 22 27
Картошка 38 35 51 16

Для установки отступа между границей клетки и содержимым клетки нужно набрать:
1. В теге <TABLE> перед символом >:
CELLPADDING="n", где n - длина отступа в пикселях.

Задание. Вот теперь Вас ждет серьезное испытание. Создайте следующую таблицу:

Cyber   OFTOB.COM
 
   Кибер 
 
 Maktab   Мактаб
 
    
OFTOB.COM

{jcomments on}