Элемент | ||||||
<thead> | 3+ | 1+ | 3.5+ | 1+ | 1+ | 1+ |
HTML тег <thead>
Элемент <thead> (от англ. "table header" ‒ «заголовок таблицы») используется для группирования содержимого верхнего колонтитула HTML таблицы.
Элемент <thead> используется в сочетании с элементами <tbody> и <tfoot> для разделения таблицы на логические части (тело, заголовок и нижний колонтитул).
Браузеры могут использовать эти элементы для включения прокрутки тела таблицы, независимо от заголовка и нижнего колонтитула. Так же при выводе на печать большой таблицы, которая занимает несколько страниц, эти элементы могут включать заголовок и нижний колонтитул, которые будут напечатаны в верхней и нижней части каждой страницы.
Тег <thead> должен должен располагаться внутри тега <table> после элементов <caption>, <colgroup> и перед тегами <tbody>, <tfoot> и <tr>.
Примечание: Внутри элемента <thead> должен быть определен по крайней мере один элемент <tr>.
Совет: Элементы <thead>, <tbody> и <tfoot> по умолчанию никак не влияют на внешний вид таблицы. Тем не менее, вы можете использовать стили CSS, чтобы настроить их отображение.
Синтаксис
<table>
<caption> ... </caption>
<colgroup> ... </colgroup>
<thead>
...
<tr> ... </tr>
...
</thead>
<tfoot> ... </tfoot>
<tbody> ... </tbody>
</table>
Закрывающий тег
Не обязателен.
Атрибуты
- alignУстарел в HTML5
- Выравнивает содержимое внутри элемента.
- charУстарел в HTML5
- Выравнивает содержимое в элементе по заданному символу. Атрибут char может быть использован только если атрибут align = "char".
- charoffУстарел в HTML5
- Атрибут, который позволяет произвести выравнивание в элементе с символа, указанного в атрибуте, путем смещения от определённого символа вправо (положительные значения) или влево (отрицательные значения). Атрибут charoff может быть использован только если атрибут align = "char".
- bgcolorУстарел в HTML5
- Цвет фона ячеек, которые расположены внутри контейнера <thead>.
- valignУстарел в HTML5
- Вертикальное выравнивание содержимого внутри элемента.
Для этого элемента доступны глобальные атрибуты и события.
Стилизация по умолчанию
Большинство браузеров отобразит элемент <thead> со следующими значениями CSS по умолчанию:
thead {
display: table-header-group;
vertical-align: middle;
border-color: inherit;
}
Различия между HTML 4.01 и HTML5
В HTML 5 были удалены все атрибуты тега.
Пример использования:
HTML таблица с элементами <thead>, <tfoot> и <tbody>:
Пример HTML:
Попробуй сам<table>
<thead>
<tr><th colspan="4">Это шапка таблицы</th></tr>
</thead>
<tfoot>
<tr><td colspan="4">Это подвал таблицы</td></tr>
</tfoot>
<tbody>
<tr><td>Ячейка 1</td><td>Ячейка 2</td><td>Ячейка 3</td><td>Ячейка 4</td></tr>
</tbody>
</table>
Спецификации
Спецификация | Статус |
---|---|
WHATWG HTML Living Standard (WHATWG) | Живой стандарт |
HTML 4.01 (W3C) | Рекомендация |
HTML5 (W3C) | Рекомендация |
HTML 5.1 (W3C) | Рекомендация |
Поддержка браузерами
Попробуйте сами - Примеры
Как добавить рамку вокруг таблицы:
Граница таблицы
Как избавиться от «двойной рамки»:
Одинарная рамка для таблицы
Как изменить поля и интервалы таблицы:
Поля и интервалы таблицы
Как изменить ширину таблицы:
Ширина таблицы
Как объединить столбцы таблицы:
Объединение столбцов
Как создать заголовок таблицы:
Заголовок таблицы
Как применять теги группирования элементов таблиц:
Теги группирования элементов таблиц
Учебник HTML
HTML уроки: HTML Табицы