Теперь рассмотрим как делать таблицы на странице.
Вообще это ОЧЕНЬ ВАЖНАЯ тема. Поэтому не пропускайте этот раздел, хоть он пожалуй самый сложный.
Дело в том что таблицы в HTML используются в основном не для представления данных в виде таблицы, а для создания ДИЗАЙНА сайта...для создания каркаса страницы, в котором уже размещается содержимое страницы. Но обо всем по порядку.
Таблица описывается парным тегом <table> и </table>
<table> говорит браузеру , что начинается таблица, а </table> говорит о том, что таблица заканчивается. Запомнили ?
таким образом при создании таблицы пишем сразу 2 тега
<table>
</table>
Теперь надо описать строку таблицы. Для создания строки в таблице используется парный тег <tr> </tr>
Если у нас таблица состоит из одной строки, то будет так
<table>
<tr> </tr>
</table>
Если таблица состоит из 3 строк, то делаем так :
<table>
<tr> </tr>
<tr> </tr>
<tr> </tr>
</table>
Понятно ?
Но это еще не все
В каждой строке должна находиться как минимум 1 ячейка..или иначе говоря надо кроме строки, описать еще как минимум один столбец.
Столбцы в HTML описываются с помощью тегов <td> и </td>, которые должны находиться между тегами <tr> и </tr>
Например. если у нас в таблице 1 строка и 1 столбец, т.е. например вот такая
то таблица будет описана так :
<table>
<tr><td> </td></tr>
</table>
Если таблица состоит из 1 строки и 3 столбцов, т.е. вот такая
то таблица будет описана вот так
<table>
<tr><td> </td><td> </td><td> </td></tr>
</table>
Если мы хотим добавить еще одну строку в таблицу из 3 ячеек, т.е. сделать вот такую таблицу
то код таблицы будет такой
<table>
<tr><td> </td><td> </td><td> </td></tr>
<tr><td> </td><td> </td><td> </td></tr>
</table>
А вот содержимое ячеек пишется ТОЛЬКО МЕЖДУ тегами <td> и </td>
Писать контент между <tr> и <td>, между </td> и </tr> или между </td> и </td> - НЕЛЬЗЯ.
ВАЖНО. Для описания таблицы вы должны использовать именно такой порядок : сначала пишите теги таблицы, затем теги строки, затем теги ячеек.
Заполним нашу таблицу содержимым, расположив покрасивее теги
<table>
<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>
</table>