<td> HTML

Тег <td> (от англ. table data — данные таблицы) предназначен для создания одной ячейки таблицы.

Элемент <td> должен размещаться внутри контейнера <tr>, который в свою очередь располагается внутри <table>.

Синтаксис

<table>
    <tr>
         <td>...</td>
    </tr>
</table>

Закрывающий тег не обязателен.

WAI ARIA

Значение role по умолчанию: cell

Допустимо любое значение role.

Атрибуты

  • colspan — Объединяет горизонтальные ячейки.
  • headers — Позволяет связать ячейки с заголовком.
  • rowspan — Объединяет вертикальные ячейки.

Для этого элемента доступны универсальные атрибуты и события.

colspan

Устанавливает число ячеек, которые должны быть объединены по горизонтали. Этот атрибут имеет смысл для таблиц, состоящих из нескольких строк.

Синтаксис

<td colspan="<число>">...</td>

Значения

Любое целое положительное число. Значение 0 распространяет ячейку на всю родительскую группу колонок, объединённую элементом <colgroup>. Значения выше 1000 считаются неправильными и устанавливаются в 1.

Значение по умолчанию

1

headers

Позволяет связать ячейки таблицы с заголовками. Этот атрибут предназначен для повышения доступности таблицы пользователям речевых браузеров, в обычных браузерах результат применения атрибута headers не заметен.

Для связывания ячеек между собой одной ячейке в элементе <td> или <th> задаётся атрибут id, а второй ячейке — атрибут headers со значением, совпадающим со значением id.

Синтаксис

<td id="<идентификатор>">...</td>
<td headers="<идентификатор>">...</td>

Значения

Один или несколько идентификаторов, разделенных между собой пробелом.

Значение по умолчанию

Нет.

rowspan

Устанавливает число ячеек, которые должны быть объединены по вертикали. Этот атрибут имеет смысл для таблиц, состоящих из нескольких строк.

Синтаксис

    <td rowspan="<число>">...</td>

Значения

Любое целое положительное число. Если значение установлено как 0, то ячейки объединяются до конца раздела таблицы (<thead>, <tbody> или <tfoot>) или самой таблицы. Максимально допустимое значение равно 65534.

Значение по умолчанию

1

Спецификации

Примеры

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>TD</title>
    </head>
    <body>
        <table border="1" cellpadding="7" cellspacing="0">
            <tr>
                <td colspan="2" bgcolor="#D3EDF6" align="center">Ячейка 1</td>
            </tr>
            <tr>
                <td valign="top" align="center">Ячейка 2</td>
                <td width="98%" valign="top">Ячейка 3</td>
            </tr>
        </table>
    </body>
</html>