<caption>: The Table Caption element

HTML элемент заголовка таблицы (<caption>) определяет название (заголовок) таблицы. Если этот элемент используется, он всегда должен быть первым вложенным элементом тэга <table> (en-US). Внешний вид и расположение заголовка по отношению к самой таблице может быть изменено с помощью стилей CSS caption-side (en-US) and text-align.

Категории контента (en-US) Нет
Допустимое содержимое Потоковый контент (en-US).
Пропуск тегов Конечный тег может быть пропущен, если элемент не следует сразу за ASCII пробелом или комментарием.
Допустимые родители Элемент <table> (en-US) как его первый потомок
Допустимые ARIA-роли Нет
DOM-интерфейс HTMLTableCaptionElement (en-US)

Атрибуты

Этот элемент включает глобальные атрибуты (en-US).

Устаревшие атрибуты

Следующие атрибуты устаревшие и не должны использоваться. Они описаны ниже для справки при обновлении кода и для общего сведения.

align

Этот пронумерованный атрибут указывает как заголовок должен быть выравнен по отношению к таблице. Он может иметь одно или несколько следующих значений :

left

Заголовок отображается слева от таблицы.

top

Заголовок отображается над таблицей.

Заголовок отображается справа от таблицы.

bottom

Заголовок отображается под таблицей.

Примечание: Не используйте этот атрибут, так как он устарел. Элемент <caption> должен быть стилизован с использованием свойств CSS caption-side (en-US) иtext-align.

Примечание к использованию

Когда элемент <table> (en-US), содержащий <caption> является единственным потомком элемента <figure>, вам следует использовать элемент <figcaption> вместо <caption>.

Пример

Просто пример, представляющий таблицу, которая содержит заголовок.

html
<table>
  <caption>
    Example Caption
  </caption>
  <tr>
    <th>Login</th>
    <th>Email</th>
  </tr>
  <tr>
    <td>user1</td>
    <td>user1@sample.com</td>
  </tr>
  <tr>
    <td>user2</td>
    <td>user2@sample.com</td>
  </tr>
</table>

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

Specification
HTML Standard
# the-caption-element

Совместимость с браузерами

BCD tables only load in the browser

Смотрите также