Заголовок таблицы

: The Table Head element

The HTML element defines a set of rows defining the head of the columns of the table.

Try it

Attributes

This element includes the global attributes.

Deprecated attributes

This enumerated attribute specifies how horizontal alignment of each cell content will be handled. Possible values are:

  • left , aligning the content to the left of the cell
  • center , centering the content in the cell
  • right , aligning the content to the right of the cell
  • justify , inserting spaces into the textual content so that the content is justified in the cell
  • char , aligning the textual content on a special character with a minimal offset, defined by the char and charoff attributes.

If this attribute is not set, the left value is assumed.

Warning: Do not use this attribute as it is obsolete (not supported) in the latest standard.

This attribute defines the background color of each column cell. It accepts a 6-digit hexadecimal color or a named color. Alpha transparency is not supported.

Note: Do not use this attribute, as it is non-standard. The thead element should be styled using the CSS background-color property, which can be applied to any element, including the thead , , and elements.

This attribute is used to set the character to align the cells in a column on. Typical values for this include a period (.) when attempting to align numbers or monetary values. If align is not set to char , this attribute is ignored.

Note: Do not use this attribute as it is obsolete (and not supported) in the latest standard.

This attribute is used to indicate the number of characters to offset the column data from the alignment characters specified by the char attribute.

Note: Do not use this attribute as it is obsolete (and not supported) in the latest standard.

This attribute specifies the vertical alignment of the text within each row of cells of the table header. Possible values for this attribute are:

  • baseline , which will put the text as close to the bottom of the cell as it is possible, but align it on the baseline of the characters instead of the bottom of them. If characters are all of the size, this has the same effect as bottom .
  • bottom , which will put the text as close to the bottom of the cell as it is possible;
  • middle , which will center the text in the cell;
  • top , which will put the text as close to the top of the cell as it is possible.
Читайте также:  Check if string contains any character python

Note: Do not use this attribute as it is obsolete (and not supported) in the latest standard: instead set the CSS vertical-align property on it.

Examples

Technical summary

Specifications

Browser compatibility

BCD tables only load in the browser

See also

  • Other table-related HTML Elements: , , , , , , , , ;
  • CSS properties and pseudo-classes that may be specially useful to style the element:
    • the :nth-child pseudo-class to set the alignment on the cells of the column;
    • the text-align property to align all cells content on the same character, like ‘.’.

    Found a content problem with this page?

    This page was last modified on Apr 13, 2023 by MDN contributors.

    Your blueprint for a better internet.

    MDN

    Support

    Our communities

    Developers

    Visit Mozilla Corporation’s not-for-profit parent, the Mozilla Foundation.
    Portions of this content are ©1998– 2023 by individual mozilla.org contributors. Content available under a Creative Commons license.

    Источник

    HTML Table Headers

    HTML tables can have headers for each column or row, or for many columns/rows.

    EMIL TOBIAS LINUS
    8:00
    9:00
    10:00
    11:00
    12:00
    13:00
    MON TUE WED THU FRI
    8:00
    9:00
    10:00
    11:00
    12:00
    DECEMBER

    HTML Table Headers

    Table headers are defined with th elements. Each th element represents a table cell.

    Example

    Vertical Table Headers

    To use the first column as table headers, define the first cell in each row as a element:

    Example

    Align Table Headers

    By default, table headers are bold and centered:

    Firstname Lastname Age
    Jill Smith 50
    Eve Jackson 94

    To left-align the table headers, use the CSS text-align property:

    Example

    Header for Multiple Columns

    You can have a header that spans over two or more columns.

    Name Age
    Jill Smith 50
    Eve Jackson 94

    To do this, use the colspan attribute on the element:

    Example

    You will learn more about colspan and rowspan in the Table colspan & rowspan chapter.

    Table Caption

    You can add a caption that serves as a heading for the entire table.

    Monthly savings

    Month Savings
    January $100
    February $50

    To add a caption to a table, use the tag:

    Example

    HTML Exercises

    Unlock Full Access 50% off

    COLOR PICKER

    colorpicker

    Join our Bootcamp!

    Report Error

    If you want to report an error, or if you want to make a suggestion, do not hesitate to send us an e-mail:

    Thank You For Helping Us!

    Your message has been sent to W3Schools.

    Top Tutorials
    Top References
    Top Examples
    Get Certified

    W3Schools is optimized for learning and training. Examples might be simplified to improve reading and learning. Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot warrant full correctness of all content. While using W3Schools, you agree to have read and accepted our terms of use, cookie and privacy policy.

    Источник

    Заголовок таблицы

    При большом количестве таблиц на странице каждой из них удобно задать заголовок, содержащий название таблицы и ее описание. Для этой цели в HTML существует специальный тег , который устанавливает текст и его положение относительно таблицы. Проще всего размещать текст по центру таблицы сверху или снизу от нее, в остальных случаях браузеры по разному интерпретируют атрибуты тега , из-за чего результат получается неодинаковый. По умолчанию заголовок помещается сверху таблицы по центру, его ширина не превышает ширины таблицы и в случае длинного текста он автоматически переносится на новую строку. Для изменения положения заголовка у тега существует атрибут align , который может принимать следующие значения.

    • left — выравнивает заголовок по левому краю таблицы. Браузер Firefox располагает текст сбоку от таблицы, Internet Explorer и Opera располагают заголовок сверху, выравнивая его по левому краю.
    • right — в браузере Internet Explorer и Opera располагает заголовок сверху таблицы и выравнивает его по правому краю таблицы. Firefox отображает заголовок справа от таблицы.
    • center — заголовок располагается сверху таблицы по ее центру. Такое расположение задано в браузерах по умолчанию.
    • top — результат аналогичен действию атрибута center , но в отличие от него входит в спецификацию HTML 4 и понимается всеми браузерами.
    • bottom — заголовок размещается внизу таблицы по ее центру.

    Пример 12.7. Создание заголовка таблицы

           
    Изменение добычи ресурсов по годам
     200320042005
    Нефть435179
    Золото293448
    Дерево385736

    Ниже показан результат данного примера (рис. 12.9).

    Рис. 12.9

    Рис. 12.9. Вид заголовка таблицы в браузере Safari

    HTML по теме

    Не выкладывайте свой код напрямую в комментариях, он отображается некорректно. Воспользуйтесь сервисом cssdeck.com или jsfiddle.net, сохраните код и в комментариях дайте на него ссылку. Так и результат сразу увидят.

    Популярные рецепты

    • Как добавить картинку на веб-страницу?
    • Как добавить иконку сайта в адресную строку браузера?
    • Как добавить фоновый рисунок на веб-страницу?
    • Как сделать обтекание картинки текстом?
    • Как растянуть фон на всю ширину окна?
    • Как выровнять фотографию по центру веб-страницы?
    • Как разместить элементы списка горизонтально?
    • Как убрать подчеркивание у ссылок?
    • Как убрать маркеры в маркированном списке?
    • Как изменить расстояние между строками текста?
    • Как сделать, чтобы картинка менялась при наведении на нее курсора мыши?
    • Как открыть ссылку в новом окне?

    Популярные задачи

    • TEX
    • Отступы между блоков
    • Андроид в тени
    • Ссылка как кнопка
    • Вложенные списки
    • Форма регистрации
    • Объединение ячеек таблицы
    • Обязательные поля формы
    • Цвет и фон в таблице
    • Асуанская плотина
    • Батарейка
    • Заголовки

    Источник

    Заголовок таблицы

    При большом количестве таблиц на странице каждой из них удобно задать заголовок, содержащий название таблицы и ее описание. Для этой цели в HTML существует специальный тег , который устанавливает текст и его положение относительно таблицы. Проще всего размещать текст по центру таблицы сверху или снизу от нее, в остальных случаях браузеры по разному интерпретируют атрибуты тега , из-за чего результат получается неодинаковый. По умолчанию заголовок помещается сверху таблицы по центру, его ширина не превышает ширины таблицы и в случае длинного текста он автоматически переносится на новую строку. Для изменения положения заголовка у тега существует атрибут align , который может принимать следующие значения.

    • left — выравнивает заголовок по левому краю таблицы. Браузер Firefox располагает текст сбоку от таблицы, Internet Explorer и Opera располагают заголовок сверху, выравнивая его по левому краю.
    • right — в браузере Internet Explorer и Opera располагает заголовок сверху таблицы и выравнивает его по правому краю таблицы. Firefox отображает заголовок справа от таблицы.
    • center — заголовок располагается сверху таблицы по ее центру. Такое расположение задано в браузерах по умолчанию.
    • top — результат аналогичен действию атрибута center , но в отличие от него входит в спецификацию HTML 4 и понимается всеми браузерами.
    • bottom — заголовок размещается внизу таблицы по ее центру.

    Пример 12.7. Создание заголовка таблицы

           
    Изменение добычи ресурсов по годам
     200320042005
    Нефть435179
    Золото293448
    Дерево385736

    Ниже показан результат данного примера (рис. 12.9).

    Рис. 12.9

    Рис. 12.9. Вид заголовка таблицы в браузере Safari

    HTML по теме

    Не выкладывайте свой код напрямую в комментариях, он отображается некорректно. Воспользуйтесь сервисом cssdeck.com или jsfiddle.net, сохраните код и в комментариях дайте на него ссылку. Так и результат сразу увидят.

    Популярные рецепты

    • Как добавить картинку на веб-страницу?
    • Как добавить иконку сайта в адресную строку браузера?
    • Как добавить фоновый рисунок на веб-страницу?
    • Как сделать обтекание картинки текстом?
    • Как растянуть фон на всю ширину окна?
    • Как выровнять фотографию по центру веб-страницы?
    • Как разместить элементы списка горизонтально?
    • Как убрать подчеркивание у ссылок?
    • Как убрать маркеры в маркированном списке?
    • Как изменить расстояние между строками текста?
    • Как сделать, чтобы картинка менялась при наведении на нее курсора мыши?
    • Как открыть ссылку в новом окне?

    Популярные задачи

    • TEX
    • Отступы между блоков
    • Андроид в тени
    • Ссылка как кнопка
    • Вложенные списки
    • Форма регистрации
    • Объединение ячеек таблицы
    • Обязательные поля формы
    • Цвет и фон в таблице
    • Асуанская плотина
    • Батарейка
    • Заголовки

    Источник

Читайте также:  Start programing in java
Оцените статью