создай свой первый сайтСайт создан на сервисе Яндекс.НародСайт создан на сервисе Sites.GoogleСайт создан на сервисе ucozСайт создан на html/css


Создание таблиц в html,
добавление строк, ячеек, объединение ячеек в таблице

Существует такое понятие как "табличный дизайн", когда структура (каркас) веб-страницы состоит из таблиц.
Таблицы формируются следующими парными тегами.
<table>...</table> - задают начало и окончание таблицы
<tr>...</tr> - добавление новой строки в таблицу
<td>...</td> - добавление обычной ячейки в таблицу
Таблицам с помощью атрибутов указывают ширину (width), высоту (height), объединяют ячейки (rowspan, colspan), задают границы (border).

Пример таблицы с 3 строками, 3 столбцами, шириной 300 пикселей и границами в 1 пиксель (указаны координаты ячеек по строкам и столбцам, высота таблицы - по содержимому):
<table width="300" border="1">
<tr>
<td>1 строка 1 столбец</td>
<td>1 строка 2 столбец</td>
<td>1 строка 3 столбец</td>
</tr>
<tr>
<td>2 строка 1 столбец</td>
<td>2 строка 2 столбец</td>
<td>2 строка 3 столбец</td>
</tr>
<tr>
<td>3 строка 1 столбец</td>
<td>3 строка 2 столбец</td>
<td>3 строка 3 столбец</td>
</tr>
</table>
Результат:
1 строка 1 столбец 1 строка 2 столбец 1 строка 3 столбец
2 строка 1 столбец 2 строка 2 столбец 2 строка 3 столбец
3 строка 1 столбец 3 строка 2 столбец 3 строка 3 столбец

С помощью атрибутов colspan и rowspan можно объединить ячейки, соответственно,
в столбцах и строках.
Пример:

<table width="300" border="1">
<tr>
<td rowspan="2">1 строка и  2 строка - ячейки объединены</td>
<td>1 строка 2 столбец</td>
<td>1 строка 3 столбец</td>
</tr>
<tr>
<td>2 строка 2 столбец</td>
<td>2 строка 3 столбец</td>
</tr>
<tr>
<td colspan="3">3 строка - 3 ячейки объединены</td>
</tr> </table>
Результат:
1 строка и 2 строка - ячейки объединены 1 строка 2 столбец 1 строка 3 столбец
2 строка 2 столбец 2 строка 3 столбец
3 строка - 3 ячейки объединены

На этом наше знакомство с таблицами закончим. Далее нам предстоит создать полноценную веб-страницу, основанную на таблицах.

Источник урока: 1sait.com