Тег <td> (сокращение от данных таблицы) определяет ячейку данных в таблице. Ячейки таблицы могут содержать два типа информации: информация заголовка и данные.
- Элемент
<th>определяет ячейку, которая содержит информацию о заголовке. - Элемент
<td>определяет ячейку, которая содержит данные.
Это различие позволяет браузеру визуально разделять заголовок и ячейки данных даже при отсутствии таблиц стилей. Например, текст ячейки заголовка отображается жирным шрифтом, а текст внутри ячейки данных отображается как обычный текст.
| Родительский: | <tr> |
| Контент: | Блочные, строчные элементы, текст |
| Открывающий тег: | Обязательный |
| Закрывающий тег: | Обязательный |
| Версия: | HTML 3.2, 4, 4.01, 5 |
Синтаксис
Базовый синтаксис тега <td> выглядит следующим образом:
HTML / XHTML: <td> ... </td>Примеры написания кода тега <td>:
<table>
<caption>Данные пользователя</caption>
<tdead>
<tr>
<td>Номер</td>
<td>Имя</td>
<td>Email</td>
</tr>
</tdead>
<tbody>
<tr>
<td>1</td>
<td>John Carter</td>
<td>johncarter@mail.com</td>
</tr>
<tr>
<td>2</td>
<td>Peter Parker</td>
<td>peterparker@mail.com</td>
</tr>
<tr>
<td>3</td>
<td>John Rambo</td>
<td>johnrambo@mail.com</td>
</tr>
</tbody>
</table>Специальные атрибуты тега
В следующей таблице приведены атрибуты, которые относятся к тегу <td>:
| Атрибут | Значение | Описание |
|---|---|---|
abbr |
text | Краткое сокращенное описание содержимого ячейки. |
align |
leftrightcenterjustifychar |
Определяет выравнивание содержимого ячейки. |
axis |
text | Категоризирует ячейки таблицы. |
bgcolor |
color | Устанавливает цвет фона ячейки таблицы. |
char |
character | Устанавливает символ, которому должно соответствовать содержимое ячейки. |
charoff |
number | Определяет количество символов, на которое содержимое ячейки будет смещено от символов выравнивания, указанных атрибутом char. |
colspan |
number | Определяет количество столбцов, охватываемых текущей ячейкой. |
headers |
header-id | Определяет одну или несколько ячеек заголовка, с которыми связана ячейка. |
height |
length | Устанавливает высоту ячейки таблицы. |
nowrap |
nowrap |
Этот логический атрибут сообщает браузеру отключить автоматическое перенос текста для этой ячейки. |
rowspan |
number | Определяет количество строк, охватываемых текущей ячейкой. |
scope |
colcolgrouprowrowgroup |
Определяет способ связывания ячеек заголовка и ячеек данных в таблице. |
valign |
topmiddlebottombaseline |
Определяет вертикальное выравнивание содержимого в ячейке таблицы. |
width |
length | Устанавливает ширину ячейки таблицы. |
Глобальные атрибуты
Как и все другие HTML-теги, тег <td> поддерживает все глобальные атрибуты в HTML5.
Атрибуты для событий
Тег <td> так же поддерживает атрибуты событий в HTML5.
Поддержка браузеров
Тег <td> поддерживается во всех основных браузерах.
