что означает тег tbody

: The Table Body element

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:

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

As this attribute is deprecated, use the CSS text-align property instead.

Note: The equivalent text-align property for the align=»char» is not implemented in any browsers yet. See the text-align ‘s browser compatibility section for the value.

The background color of the table. It is a 6-digit hexadecimal RGB code, prefixed by a ‘ # ‘. One of the predefined color kewords can also be used.

As this attribute is deprecated, use the CSS background-color property instead.

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

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

As this attribute is deprecated, use the CSS vertical-align property instead.

Usage notes

Examples

Basic example

The table’s HTML is shown here. Note that all of the body cells including information about students are contained within a single

element.

The CSS to style our table is shown next.

First, the table’s overall style attributes are set, configuring the thickness, style, and color of the table’s exterior borders and using border-collapse to ensure that the border lines are shared among adjacent cells rather than each having its own borders with space in between. font is used to establish an initial font for the table.

Then the style is set for the majority of the cells in the table, including all data cells but also those styles shared between our and cells. The cells are given a light gray outline which is a single pixel thick, padding is adjusted, and all cells are left-aligned using text-align

Result

The resulting table looks like this:

Multiple bodies

You can create multiple sections within a table by using multiple

elements. Each may potentially have its own header row or rows; however, there can be only one per table! Because of that, you need to use a filled with elements to create headers within each

. Let’s see how that’s done.

Let’s take the previous example, add some more students to the list, and update the table so that instead of listing each student’s major on every row, the students are grouped by major, with heading rows for each major.

Result

First, the resulting table, so you know what we’re building:

Источник

HTML-теги thead, th, tbody и tfoot. Разделение таблицы.

В прошлом небольшом видео ролике мы поговорили о заголовке или подписи для таблицы. Узнали, как просто подписать таблицу для облегчения ориентирования посетителей.

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

HTML-тег

.

Опять рассмотрим пример применения данного тега внутри кода HTML-таблицы. Опять же мы возьмем код из прошлой статьи и добавим к нему тег

:

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

Ячейка 1-1	Ячейка 1-2	Ячейка 1-3
Ячейка 2-1	Ячейка 2-2	Ячейка 2-3
Ячейка 3-1	Ячейка 3-2	Ячейка 3-3

Здесь также стоит обратить внимание на то, что внутри тега

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

.

HTML-тег

.

Также стоит отметить, что если мы используем тег

, мы не обязаны использовать тег

. Мы также можем воспользоваться и тегом

.

Пример исходного кода с использованием тега

:

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

Ячейка 1-1	Ячейка 1-2	Ячейка 1-3
Ячейка 2-1	Ячейка 2-2	Ячейка 2-3
Ячейка 3-1	Ячейка 3-2	Ячейка 3-3

Здесь я думаю все понятно. А вот про следующий HTML-тег следует всегда помнить.

HTML-тег

.

Дело в том, что если мы решили использовать в таблице тег

, значит, мы обязательно должны использовать и тег

, который предназначен для выделения основной части таблицы. Можно его даже назвать аналогом тега для HTML-документа в целом. Только тег

относится только к таблице, а не к целому документу.

Что касается примера. То здесь все просто. Сначала мы прописываем тег

, так как он отвечает за верхнюю часть таблицы, а затем прописываем тег

:

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

Ячейка 1-1	Ячейка 1-2	Ячейка 1-3
Ячейка 2-1	Ячейка 2-2	Ячейка 2-3
Ячейка 3-1	Ячейка 3-2	Ячейка 3-3

Однако у этого HTML-тега есть одна особенность. Если смотреть на его предназначение и предназначение других тегов, которые делят таблицу на части, то можно сделать вывод, что раз он отвечает за нижнюю часть, то и прописать его мы должны после тега

. Однако это не так. На самом деле HTML-тег должен быть указан до

. Однако информацию внутри этого тега необходимо указать ту, которая будет снизу, так как веб-браузер выведет ее под основной информацией. Это следует всегда помнить, чтобы при написании кода не запутаться.

Ну и пример HTML-тега :

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

Ячейка 1-1	Ячейка 1-2	Ячейка 1-3
Ячейка 3-1	Ячейка 3-2	Ячейка 3-3
Ячейка 2-1	Ячейка 2-2	Ячейка 2-3

Обратите внимание на порядок строк в исходном коде. И на то, что в итоге выведет веб-браузер на экран.

HTML-справочник и другие материалы можно и нужно скачать здесь!

В следующем видео уроке мы познакомимся с еще двумя тегами colgroup и col. И подведем итоги раздела, посвященного таблицам в HTML.

Источник