Тег <tbody>

Синтаксис

Описание

Тег <tbody> (от англ. table body — тело таблицы) используется для группирования основного контента в таблице, где хранится одна или несколько строк. Это позволяет создавать структурные блоки, к которым можно применять единое оформление через CSS стили.

Элемент <tbody> располагается внутри контейнера <table> после тегов <caption>, <colgroup> (если таковые имеются) и <thead>, <tfoot> (для правильного отображения нижнего колонтитула в таблице).

Любая таблица состоит из строк (тег <tr>) и ячеек (тег <td>).

Допускается применять несколько тегов <tbody> внутри контейнера <table>.

Внимание!

В тег <tbody> должен быть включен хотя бы один элемент <tr>.

Заголовок строки или столбца таблицы задается при помощи тега <th>. Данный элемент размещается в первой строке таблицы. В браузере он автоматически выделяется жирным.

Примечание!

Теги <thead>, <tbody>, <tfoot> и <th> не является обязательными элементами таблицы, но мы рекомендуем включать их в таблицу, так как они помогают лучше структурировать контент, а также помогает поисковым машинам лучше индексировать таблицы.

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

Атрибуты

Атрибут	Значение	Описание
align	right left center justify char	Указывает способ выравнивания содержимого таблицы. Не поддерживается в HTML5
bgcolor	rgb(x,x,x) #xxxxxx название цвета	Определяет цвет фона ячеек, которые расположены внутри контейнера <tbody>. Не поддерживается в HTML5
char	character	Указывает способ выравнивания содержимого элемента по заданному символу. Атрибут char используется только, если атрибут align = "char". Не поддерживается в HTML 5
charoff	число	Смещает содержимое ячеек относительно указанного символа. Используется, если атрибут align = "char". Не поддерживается в HTML 5
valign	top bottom middle baseline	Выравнивает содержимое внутри элемента по вертикали. Не поддерживается в HTML 5

Пример

HTML-код:

<!DOCTYPE html>

<head>

<title>Тег tbody</title>

</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 по умолчанию

tbody {
    display: table-row-group;
    vertical-align: middle;
    border-color: inherit;
}

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

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

Элемент

Chrome

Opera

Firefox

Safari

Microsoft Edge

<tbody>

Да

Тег <tbody>

Синтаксис

Описание

Внимание!

Примечание!

Атрибуты

Пример

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

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

Комментарии