Как растянуть ячейки.

На этом уроке я расскажу вам как можно растянуть ячейки. А просто! Для этого еть атрибут collspan и rowspan. Эти два атрибута задаются в тэге <td>. Атрибут colspan - определяет количество столбцов на которые простирается данная ячейка. Атрибут rowspan - количество рядов. Ниже приведены примеры использования этих атрибутов.

Пример использования атрибута colspan. <td colspan"число">

Снизу приведен код этой таблицы.

<table>

<tr>

<td height="40" bgcolor="#808080" colspan="2"><center>текст 1</center></td>

<td width="60" bgcolor="#FF9900"><center>текст 2</center></td>

</tr>

<tr>

<td height="40" bgcolor="#FF9900"><center>текст 4</center></td>

<td width="60" bgcolor="#808080"><center>текст 5</center></td>

<td width="60" bgcolor="#FF9900"><center>текст 6</center></td>

</tr>

</table>

Я задал значение атрибута colspan="2"(чтобы ячейка имела размер 2-ух) и удалил ячейку текст 3,оставив ячейку текст 3получилась бы вот такая ерунда:

Так как ячейка текст 1равна двум ячейкам, она вытесняет ячейку текст 3.И я ее просто взял и удалил. Еще я не использовал атрибут width в ячейке текст 1 и текст 4.Так как ячейка текст 1 и так большая.

С атрибутом colspa мы разобрались. Теперь разберемся с атрибутом rowspan.

<td rowspan="число">

Вы должны написать код этой таблицы сами. Я вам подскажу только, что принцип действия тут тот же и, что вы должны удалить ячейку текст 6.

Если вы не справились с этим заданием, то нажмите сюда.

Вот код таблицы: <table> <tr> <td height="40" width="60" bgcolor="#808080"><center>текст 1</center></td> <td width="60" bgcolor="#FF9900"><center>текст 2</center></td> <td width="60" bgcolor="#808080" rowspan="2"><center>текст 3</center></td> </tr> <tr> <td height="40" width="60" bgcolor="#FF9900"><center>текст 4</center></td> <td width="60" bgcolor="#808080"><center>текст 5</center></td> </tr> </table>

Теперь задание посложнее, но вы не боитесь? Так ведь?

Напишите код этой таблицы:

Если вы не справились с этим заданием, то нажмите сюда.

Все. Этот урок закончился. Пришлось тут воспользоваться помощью VBScript'ов. :) Остался последний урок по таблицам.