Тег <td> — CodeFind

Синтаксис

Описание

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

Внимание!

Элемент должен находиться внутри контейнера <tr> (определяет строки таблицы), который в свою очередь располагается внутри элемента <table>. Для определения заголовочной ячейки используется тег <th>.

Содержимым тега <td> может быть любой HTML-элемент: текст, форма, изображение, таблица и т.д.

По умолчанию содержимое ячейки отображается обычным шрифтом и выравнивается по левому краю.

Чаще всего с тегом <td> используют атрибуты colspan и rowspan, чтобы содержимое охватывало несколько столбцов или строк.

Атрибуты, которые можно использовать в теге <td>, указаны ниже. Также тег поддерживает глобальные атрибуты и атрибуты события.

Атрибуты

Атрибут	Значение	Описание
abbr	текст	Определяет сокращенный вариант содержимого ячейки, либо выступает в роли альтернативного текста
align	left right center justify char	Выравнивает содержимое ячейки данных таблицы. Не поддерживается в HTML5
axis	текст	Задает группировку ячеек, связанных между собой похожей информацией. Не поддерживается в HTML 5
background	URL-адрес	Задает фоновый рисунок в ячейке. Не поддерживается в HTML 5
bgcolor	rgb(x,x,x) #xxxxxx название цвета	Задает цвет фона ячейки таблицы. Не поддерживается в HTML 5
bordercolor	rgb(x,x,x) #xxxxxx название цвета	Задает цвет рамки. Не поддерживается в HTML 5
char	символ	Выравнивает содержимое ячейки данных таблицы по заданному символу. Атрибут char используется только если атрибут align = "char". Не поддерживается в HTML 5
charoff	число	Атрибут позволяет произвести выравнивание в ячейке данных с указанного в атрибуте символа вправо или влево. Атрибут charoff используется только, если атрибут align = "char". Не поддерживается в HTML 5
colspan	число	Атрибут определяет количество столбцов, которое ячейка должна охватывать. Значение атрибута должно быть положительным целым числом. Не рекомендуется использовать значения свыше 1000, т.к. они могут быть сокращены до этого числа. Значение по умолчанию 1
headers	id заголовка	Указывает id одной или нескольких заголовок ячеек, которые определяются HTML тегом <th>. Атрибут не отображается в браузере, но может быть использован для чтения с экрана или в работе скриптов
height	% px	Задает высоту ячейки. Не поддерживается в HTML 5
nowrap	nowrap	Указывает, что содержание в ячейке не должно переноситься. Не поддерживается в HTML 5
rowspan	число	Атрибут определяет количество строк, которые ячейка данных должна охватывать. Значение атрибута должно быть положительным целым числом. Не рекомендуется использовать значения свыше 65534, т.к. они могут быть обрезаны до этого числа. Значение по умолчанию 1
scope	col colgroup row rowgroup	Задает способ связывания заголовочной ячейки (HTML тег <th>) с ячейками данных в таблице. Не поддерживается в HTML 5
valign	top middle bottom baseline	Задает вертикальное выравнивание содержимого в ячейке данных. Не поддерживается в HTML 5
width	% px	Задает ширину ячейки данных. Не поддерживается в HTML 5

Пример

HTML-код:

<!DOCTYPE html>

<head>

</head>

<body>

<table>

<thead>

<tr>

<th>№</th>

<th>Страна</th>

<th>Город</th>

</tr>
</thead>
<tbody>

<tr>

<td>1</td>

<td>Россия</td>

<td>Москва</td>

</tr>

<tr>

<td>2</td>

<td>Беларусь</td>

<td>Минск</td>

</tr>

<tr>

<td>3</td>

<td>Украина</td>

<td>Киев</td>

</tr>
</tbody>

</table>

</body>

</html>

Отображение в браузере:

№	Страна	Город
1	Россия	Москва
2	Беларусь	Минск
3	Украина	Киев

Параметры CSS по умолчанию

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

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

Элемент	Chrome	Opera	Firefox	Safari	Microsoft Edge
<td>	Да	Да	Да	Да	Да

Элемент

Chrome

Opera

Firefox

Safari

Microsoft Edge

<td>

Да