Тег <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
  • Избегайте пустых строк (используйте &nbsp; при необходимости)
  • Для сложных таблиц добавляйте ARIA-атрибуты
  • Не используйте для верстки страниц (применяйте CSS Grid/Flexbox)

Тег <tr> является фундаментальным элементом для создания строк таблицы, обеспечивая структурированное представление данных с возможностями стилизации и доступности.

Атрибуты

align Горизонтальное выравнивание содержимого
bgcolor Цвет фона строки
char Символ для выравнивания
charoff Смещение выравнивания
valign Вертикальное выравнивание содержимого
class CSS-классы для стилизации
data-* Пользовательские данные
dir Направление текста
hidden Скрывает элемент
id Уникальный идентификатор
lang Язык содержимого
style Инлайновые стили
tabindex Порядок перехода
title Всплывающая подсказка
translate Определяет возможность перевода
role ARIA-роль
aria-* ARIA-атрибуты

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