<tbody>

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

Синтаксис тега <tbody>

<table>
  <tbody>
    <tr>
      <td>Строка 1, столбец 1</td>
      <td>Строка 1, колонка 2</td>
    </tr>
    <tr>
      <td>Строка 2, колонка 1</td>
      <td>Строка 2, колонка 2</td>
    </tr>
  </tbody>
</table>

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

Тег является частью спецификации HTML Living Standard.

Семантический или нет

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

Примеры использования

Группировка строк таблицы:

<table>
  <thead>
    <tr>
      <th>Имя</th>
      <th>Возраст</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Серёжа</td>
      <td>25</td>
    </tr>
    <tr>
      <td>Саша</td>
      <td>30</td>
    </tr>
  </tbody>
</table>

Добавление стиля к строкам таблицы:

<table>
  <tbody>
    <tr class="even">
      <td>Строка 1, столбец 1</td>
      <td>Строка 1, колонка 2</td>
    </tr>
    <tr class="odd">
      <td>Строка 2, колонка 1</td>
      <td>Строка 2, колонка 2</td>
    </tr>
  </tbody>
</table>

Использование вложенных тегов <tbody>:

<table>
  <tbody>
    <tr>
      <td>Строка 1, столбец 1</td>
      <td>Строка 1, колонка 2</td>
    </tr>
    <tbody>
      <tr>
        <td>Строка 2, колонка 1</td>
        <td>Строка 2, колонка 2</td>
      </tr>
    </tbody>
  </tbody>
</table>

Для чего использовать тег <tbody>

• для группировки данных в HTML-таблицу;
• чтобы по-разному стилизовать строки таблицы: добавьте класс или id к тегам <tr> внутри <tbody> для применения стилей CSS;
• чтобы добавить обработчик событий к строкам таблицы: добавьте обработчики событий в теги <tr> внутри <tbody> для обработки взаимодействия с пользователем;
• для чередования цветов строк: используйте CSS для добавления чередующихся цветов фона к строкам внутри <tbody>;
• добавление атрибутов данных к тегам <tr> внутри <tbody> для хранения дополнительных данных.

Атрибуты тега <tbody>

У тега нет специфических атрибутов.

Глобальные атрибуты

Тег поддерживает все глобальные атрибуты HTML.

Ограничения

Тег <tbody> можно использовать только как дочерний тег <table>.

Нюансы

Если тег <tbody> не используется, браузер автоматически создаст его для группировки тегов <tr> внутри тега code><table> .

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

Тег <tbody> поддерживается всеми основными веб-браузерами.

Актуальная информация — на сaniuse.

Альтернативные теги

Альтернативных тегов для тега <tbody> не существует.

Чем заменить тег

Прямой замены тегу <tbody> не существует.

Актуальность

Тег <tbody> не является устаревшим.

Хотите узнать больше об HTML-тегах?

Прочитайте справочник по HTML или познакомьтесь с вёрсткой на интерактивных тренажёрах в HTML Academy.

«Доктайп» — журнал о фронтенде. Читайте, слушайте и учитесь с нами.