Тег <tr>
Описание
Тег <tr>
(table row) создает строку в HTML-таблице, содержащую ячейки данных (<td>
) или заголовков (<th>
). Это основной структурный элемент для организации табличных данных по строкам.
<table>
<tr>
<td>Ячейка 1</td>
<td>Ячейка 2</td>
</tr>
</table>
Ключевые особенности:
- Может содержать ячейки
<td>
и<th>
- Должен находиться внутри
<table>
,<thead>
,<tbody>
или<tfoot>
- Поддерживает глобальные HTML-атрибуты
- Может иметь разные типы ячеек в одной строке
- Важен для доступности табличных данных
<!-- Простая строка с данными -->
<tr>
<td>Данные 1</td>
<td>Данные 2</td>
</tr>
<!-- Строка с заголовком -->
<tr>
<th scope="row">Итого:</th>
<td>1000 руб.</td>
</tr>
<!-- Строка с объединенными ячейками -->
<tr>
<td colspan="2">Объединенные ячейки</td>
</tr>
<!-- Группа строк в tbody -->
<tbody>
<tr><td>Январь</td><td>100</td></tr>
<tr><td>Февраль</td><td>150</td></tr>
</tbody>
Рекомендации по использованию:
- Используйте семантические контейнеры (
<thead>
,<tbody>
,<tfoot>
) - Для заголовков применяйте
<th>
с атрибутомscope
- Избегайте пустых строк (используйте
при необходимости) - Для сложных таблиц добавляйте ARIA-атрибуты
- Не используйте для верстки страниц (применяйте CSS Grid/Flexbox)
Тег <tr>
является фундаментальным элементом для создания строк таблицы, обеспечивая структурированное представление данных с возможностями стилизации и доступности.
Атрибуты
align | Горизонтальное выравнивание содержимого |
bgcolor | Цвет фона строки |
char | Символ для выравнивания |
charoff | Смещение выравнивания |
valign | Вертикальное выравнивание содержимого |
accesskey | Горячая клавиша для активации |
class | CSS-классы для стилизации |
contenteditable | Разрешает редактирование |
data-* | Пользовательские данные |
dir | Направление текста |
hidden | Скрывает элемент |
id | Уникальный идентификатор |
lang | Язык содержимого |
style | Инлайновые стили |
tabindex | Порядок перехода |
title | Всплывающая подсказка |
translate | Определяет возможность перевода |
role | ARIA-роль |
aria-* | ARIA-атрибуты |
Поддержка браузерами
![]() |
![]() |
![]() |
![]() |
![]() |
---|---|---|---|---|
3.0 | 1.0 | 1.0 | 1.0 | 1.0 |