Таблицы в HTML
Таблица сотоит из 3 элементов:
<table> - начало таблицы
<tr> - начало cтроки
<td> создание ячеек </td>
</tr> - конец строки
</table> - конец таблицы
<th> элемент заголовка </th> - вместо </td>
Форматирование таблицы
Выравнивание - <table align="center">
Ширина - <table width="200px/20%"> можно в px или в %
Расттояние между ячейками - <table cellspacing="4">
Расстояние между содержимым и границами ячейки - <table cellpadding="4">
Выравнивание содержимого строки(ячейки) по горизонтали - <tr align="center/justify">
Выравнивание содержимого строки(ячейки) по вертикали -
<tr vlign="top/middle/bottom/baseline">
- Действует если много текста.
(Примечание:приоритет имеют атрибуты ячейки)
Также тут используется атрибут <tr title="коментарий">
<td height/width="5"> - влияет на строки и вообщем на таблицу
<td bgcolor="red"> - задание цвета
<td сolspan="n"> - соединяет n ячеек погоризонтали
<td rowspan="n"> - соединяет n ячеек повертикали
Пример:
1 | 2 | |
4 | 5 | |
7 | 8 | 9 |
<table border="1" align="center" width="50%" bgcolor="#CCCCCC">
<tr>
<td colspan="2" bg bgcolor="red">1</td><td rowspan="2">2</td>
</tr>
<tr>
<td width="10px">4</td><td>5</td>
</tr>
<tr>
<td>7</td><td>8</td><td>9</td>
</tr>
</table>
Если немного изменить строку, мы избавимся от расстояния между ячейками и от очерченых границ между ними:
<table border="0" align="center" width="50%" bgcolor="#CCCCCC" cellspacing="0">
1 | 2 | |
4 | 5 | |
7 | 8 | 9 |
Также бывают вложенные таблицы смотреть пример>>>
В настоящее время таблицы используются не только по прямому назначению, но также и для форматирования страниц.