Основным элементом в таблице является тег table/table, он содержит в себе все остальные теги. Строки таблицы - (по-английски -row) обозначаются тегом tr/tr, в строке находятся ячейки td/td.

Уроки HTML

Тег table/table - таблица

Урок 9

Этот тег означает table data- данные таблицы.

<table>//таблица
<tr>//строка 1
<td>ячейка № 1</td><td>ячейка № 2</td><td>ячейка № 3</td>//ячейки первой строки
</tr>//конец первой строки
<tr>//строка 2
<td>ячейка № 1</td><td>ячейка № 2</td><td>ячейка № 3</td>//ячейки второй строки
</tr>//конец второй строки
</table>//конец таблицы

ячейка № 1 ячейка № 2 ячейка № 3
ячейка № 1 ячейка № 2 ячейка № 3

Если в тег table добавить атрибут border="1"(или 2,3,4....), то таблица приобретет рамку, толщина которой будет зависеть от значения атрибута.

<table border="1">//таблица с рамкой
<tr>//строка 1
<td>ячейка № 1</td><td>ячейка № 3</td><td>ячейка № 3</td>//ячейки первой строки
</tr>//конец первой строки
<tr>//строка 2
<td>ячейка № 1</td><td>ячейка № 3</td><td>ячейка № 3</td>//ячейки второй строки
</tr>//конец второй строки
</table>//конец таблицы

ячейка № 1 ячейка № 2 ячейка № 3
ячейка № 1 ячейка № 2 ячейка № 3

Можно добавить "шапку" для таблицы, дать названия ячеек: для этого применяют тег th/th-table header.

Этот тег нужно поместить в начале таблицы: после тега table и между тегамиtr/tr

<table border="1">//таблица с рамкой
<tr>
<th>Заголовок 1</th><th>Заголовок 2</th><th>Заголовок 3</th>
</tr>
<tr>//строка 1
<td>ячейка № 1</td><td>ячейка № 3</td><td>ячейка № 3</td>//ячейки первой строки
</tr>//конец первой строки
<tr>//строка 2
<td>ячейка № 1</td><td>ячейка № 3</td><td>ячейка № 3</td>//ячейки второй строки
</tr>//конец второй строки
</table>//конец таблицы

Заголовок 1Заголовок 2Заголовок 3
ячейка № 1ячейка № 2ячейка № 3
ячейка № 1ячейка № 2ячейка № 3

Как правило количество заголовков таблицы должно совпадать с количеством ячеек в строке.

С уважением, авторы сайта Компьютерапия


Понравилась статья? Поделитесь ею с друзьями и напишите отзыв в комментариях!



We use cookies on our website. Some of them are essential for the operation of the site, while others help us to improve this site and the user experience (tracking cookies).

You can decide for yourself whether you want to allow cookies or not. Please note that if you reject them, you may not be able to use all the functionalities of the site.

Ok