ЛУЧШИЙ САЙТ ДЛЯ ВЕБ-РАЗРАБОТЧИКОВ
HTML теги. Полный справочник

HTML тег <td>


Пример

Простая HTML таблица с двумя ячейками таблицы:

<table>
  <tr>
    <td>Cell A</td>
    <td>Cell B</td>
  </tr>
</table>
Попробуйте сами »

Больше примеров "Попробуйте сами" ниже.


Определение и использование

Тег <td> определяет стандартную ячейку в HTML таблице.

HTML-таблица имеет два вида ячеек:

  • Ячейки заголовка - содержит информацию заголовка (созданную с помощью элемента <th>).
  • Стандартные ячейки - содержит данные (созданные с помощью элемента <td>)

Текст в элементах <th> по умолчанию выделен жирным шрифтом и центрирован.

Текст в элементах <td> по умолчанию обычный и выровненный по левому краю.


Поддержка браузерами

Элемент
<td> Yes Yes Yes Yes Yes

Советы и примечания

Совет: Используйте атрибуты colspan и rowspan, чтобы содержимое охватывало несколько столбцов или строк!


Различия между HTML 4.01 и HTML5

Все атрибуты макета в HTML5 удалены.


Атрибуты

Атрибут Значение Описание
abbr text Не поддерживается в HTML5.
Определяет сокращенную версию содержимого в ячейке
align left
right
center
justify
char
Не поддерживается в HTML5.
Выравнивает содержимое в ячейке
axis category_name Не поддерживается в HTML5.
Категоризирует ячейки
bgcolor rgb(x,x,x)
#xxxxxx
colorname
Не поддерживается в HTML5.
Определяет цвет фона ячейки
char character Не поддерживается в HTML5.
Выравнивает содержимое в ячейке по персонажу
charoff number  Не поддерживается в HTML5.
Устанавливает количество символов, содержимое которых будет выровнено по символу, указанному атрибутом char
colspan number Определяет количество столбцов, которые ячейка должна охватывать
headers header_id Определяет одну или несколько ячеек заголовка, с которыми связана ячейка
height pixels
%
Не поддерживается в HTML5.
Устанавливает высоту ячейки
nowrap nowrap Не поддерживается в HTML5.
Указывает, что содержимое внутри ячейки не должно переноситься
rowspan number Устанавливает количество строк в ячейке
scope col
colgroup
row
rowgroup
Не поддерживается в HTML5.
Определяет способ связывания ячеек заголовка и ячеек с данными в таблице
valign top
middle
bottom
baseline
Не поддерживается в HTML5.
Вертикально выравнивает содержимое в ячейке
width pixels
%
Не поддерживается в HTML5.
Определяет ширину ячейки

Глобальные атрибуты

Тег <td> также поддерживает Глобальные атрибуты в HTML.


Атрибуты событий

Тег <td> также поддерживает Атрибуты событий в HTML.


Попробуйте сами - примеры

Заголовки таблицы
Как создать заголовки таблицы.

Таблица с подписью
HTML таблица с подписью.

Теги внутри таблицы
Как отобразить элементы внутри других элементов.

Ячейки, занимающие более одной строки / столбца
Как определить ячейки таблицы, которые занимают более одной строки или одного столбца.


Связанные страницы

HTML учебник: HTML Таблицы

HTML DOM справочник: Объект TableData

CSS учебник: Стилизация таблиц


Настройки CSS по умолчанию

Большинство браузеров будут отображать элемент <td> со следующими значениями по умолчанию:

td {
  display: table-cell;
  vertical-align: inherit;
}