Создание таблиц 2
Содержание
Таблицы в HTML
Начало и конец таблицы задаются тегами <table> </table>.
Строки задаются тегами <tr> </tr>
Столбцы задаются тегами <td> </td>
Пример:
<table>
<tr>
<td>Первая ячейка</td>
<td>Вторая ячейка</td>
</tr>
<tr>
<td>Третья ячейка</td>
<td>Четвертая ячейка</td>
</tr>
</table>
В Wiki это будет выглядеть так:
Первая ячейка | Вторая ячейка |
Третья ячейка | Четвертая ячейка |
Рамка
Обозначение рамки
Для обозначения рамки используется тег border.
Пример:
<table border="1">
<tr>
<td>Первая ячейка</td>
<td>Вторая ячейка</td>
</tr>
<tr>
<td>Третья ячейка</td>
<td>Четвертая ячейка</td>
</tr>
</table>
В Wiki это будет выглядеть так:
Первая ячейка | Вторая ячейка |
Третья ячейка | Четвертая ячейка |
Толщина рамки
Вы сами можете менять толщину рамки вокруг таблицу (между ячейками рамка всегда одной толщины): border="1" - самая тонкая рамка, border="10" - самая толстая:
Первая ячейка | Вторая ячейка |
Третья ячейка | Четвертая ячейка |
Расстояние между ячейками
Для изменения расстояния между соседними ячейками используется тег cellspacing
Пример:
<table border="6" cellspacing="10">
<tr>
<td>Первая ячейка</td>
<td>Вторая ячейка</td>
</tr>
<tr>
<td>Третья ячейка</td>
<td>Четвертая ячейка</td>
</tr>
</table>
В Wiki это будет выглядеть так:
Первая ячейка | Вторая ячейка |
Третья ячейка | Четвертая ячейка |
Расстояние внутри ячеек
Для изменения расстояния внутри ячеек используется тег cellpadding.
Пример:
<table border="6" cellpadding="10">
<tr>
<td>Первая ячейка</td>
<td>Вторая ячейка</td>
</tr>
<tr>
<td>Третья ячейка</td>
<td>Четвертая ячейка</td>
</tr>
</table>
В Wiki это будет выглядеть так:
Первая ячейка | Вторая ячейка |
Третья ячейка | Четвертая ячейка |
Объединение ячеек
По горизонтали
Для объединения ячеек по горизонтали используется тег colspan.
Пример: (объединим первую и вторую ячейки)
<table border="1">
<tr>
<td colspan="2">Первая ячейка</td>
</tr>
<tr>
<td>Третья ячейка</td>
<td>Четвертая ячейка</td>
</tr>
</table>
В Wiki это будет выглядеть так:
Первая ячейка | |
Третья ячейка | Четвертая ячейка |