Простые таблицы — довольно большая редкость. Гораздо чаще встречаются сложные таблицы, в которых ячейки располагаются одновременно в нескольких соседних столбцах или строках.

Для объединения ячеек используют следующие атрибуты тега <TD>:

• colspan – сообщает программе просмотра, что нужно раздвинуть клетку таблицы на несколько столбцов.

Например, если нужно объединить ячейки двух столбцов, напишем <TD colspan = "2"> .

• rowspan – сообщает программе просмотра, что нужно раздвинуть клетку таблицы на несколько строк.

Например, <TD rowspan = "2">  растягивает клетку таблицы на две строки.

К примеру нам надо создать вот такую таблицу:

Сложная таблица

Если присмотреться, у нас таблица состоит из двух строк и трех столбцов.

Но, в первом столбце обе ячейки объединены в одну - это ячейка под названием  "Большая ячейка А". 

А также в нижней строке объединены в одну еще две ячейки.

Вот фрагмент кода создания таблицы с различной шириной строк и столбцов. Атрибут border тега <TABLE> устанавливает ширину бордюра (рамки таблицы) и может принимать любое значение от 0 до 10. Ширина бордюра = 0 обозначает его отсутствие.

В первой строке мы описали три ячейки, причем первая ячейка как бы захватывает и вторую строку. Поэтому во второй строке мы должны были описать две ячейки (то есть два тега <TD>), но поскольку мы эти две ячейки объединили, во второй строке остался всего один тег <TD>.

Разберем пример чуть-чуть посложнее. 

Попытаемся создать таблицу следующего вида:

Таблица цветов
		blue
		green
		red
		pink
		yellow

Вот фрагмент кода для данной таблицы: