<td> - HTML-елемент комірки таблиці

HTML-елемент <td> (або елемент комірки таблиці) визначає комірку в таблиці, яка містить дані. Він повинен бути нащадком елемента <tr>.

Тег <td> (table data) створює комірку в таблиці, яка містить дані. Кожен елемент <td> знаходиться всередині елемента рядка таблиці <tr>.

Разом з <td>, для створення повноцінних таблиць використовуються інші елементи, такі як <table>, <th> (для заголовків), <thead>, <tbody> та <tfoot>, що дозволяє створювати добре структуровані та доступні табличні дані.

HTML
<td>...</td>

Атрибути

Цей тег може мати глобальні атрибути.

colspan: Цей атрибут містить додатне ціле число, яке вказує, на скільки стовпців має розтягуватися комірка.
rowspan: Цей атрибут містить додатне ціле число, яке вказує, на скільки рядків має розтягуватися комірка.
headers: Цей атрибут містить список рядків, розділених пробілами. Кожен рядок є id елемента <th>, який застосовується до цієї комірки.
abbr: Цей атрибут містить короткий, скорочений опис вмісту комірки. Деякі допоміжні технології, такі як екранні зчитувачі, можуть представляти цю інформацію перед самим вмістом.
align: Цей атрибут визначає горизонтальне вирівнювання вмісту комірки. Можливі значення: left, center, right, justify, та char. Цей атрибут є застарілим, використовуйте CSS властивість text-align.
bgcolor: Визначає колір фону комірки. Цей атрибут є застарілим, використовуйте CSS властивість background-color.
height: Визначає висоту комірки. Цей атрибут є застарілим, використовуйте CSS властивість height.
width: Визначає ширину комірки. Цей атрибут є застарілим, використовуйте CSS властивість width.

Технічне резюме

Категорія контенту	Немає.
Дозволений вміст	Потоковий контент.
Пропуск тегів	Кінцевий тег може бути пропущений, якщо за ним відразу слідує інший елемент `<td>` або `<th>`, або якщо в батьківському елементі більше немає вмісту.
Дозволені батьківські елементи	Елемент `<tr>`.
Роль ARIA	`cell`
DOM інтерфейс	`HTMLTableCellElement`

Приклади використання

<table>
  <tr>
    <td>Комірка 1.1</td>
    <td>Комірка 1.2</td>
  </tr>
  <tr>
    <td>Комірка 2.1</td>
    <td>Комірка 2.2</td>
  </tr>
</table>

table, td {
  border: 1px solid black;
  padding: 5px;
}

<table>
  <tr>
    <th colspan="2">Ім’я</th>
    <th>Вік</th>
  </tr>
  <tr>
    <td>Іван</td>
    <td>Петренко</td>
    <td>28</td>
  </tr>
  <tr>
    <td>Марія</td>
    <td>Сидоренко</td>
    <td>34</td>
  </tr>
  <tr>
    <td colspan="3">(продовження)</td>
  </tr>
</table>

table, th, td {
  border: 1px solid black;
  border-collapse: collapse;
  padding: 5px;
  text-align: center;
}

Стилі за замовчуванням

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

Підтримка браузерів



`<td>`
`abbr`
`align`
`axis`
`bgcolor`
`char`
`charoff`
`colspan`
`headers`
`rowspan`
`scope`
`valign`
`width`