Как создавать таблицы в HTML5 - манекены

Основным контейнером разметки для таблиц в HTML является элемент таблицы. То есть вы используете открывающий тег

, чтобы обозначить начало таблицы, и вы добавляете тег закрытия

, чтобы закончить его.

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

Между этими открывающими и закрывающими тегами вы можете найти следующие элементы в этом очень интересном и предписанном (другими словами, обязательном) порядке:

Ноль или один элементов для определения заголовка таблицы (если есть один такой элемент или нет заголовка для таблицы, если он отсутствует). Если он используется, элемент должен следовать сразу после открытия тега

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

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

Элементы нулевого или большего количества элементов таблицы (

) для определения фактического содержимого для таблицы. Таблица может содержать несколько элементов , поэтому в HTML необычно, что таблица может иметь только одну голову, но несколько тел!

Нулевой или один столбец () , чтобы предоставить информацию для нижней части таблицы. Браузеры могут использовать

, и решать, что прокручивать (обычно это тело таблицы) и что оставить на экране всегда присутствующим.

Нижний колонтитул таблицы - это особый случай, когда дело доходит до того, где в последовательности разметки таблицы оно может появиться. Он всегда может появляться последним в последовательности (как в этом списке), но также может появляться сразу после любого из этих присутствующих элементов (в этом порядке):, и.

Однако он будет отображаться до

и элементов. В этом специальном случае не может также отображаться в конце таблицы. Не допускается!

Если не присутствует

элемент (который обычно определяет тело таблицы в таблице с определенным заголовком таблицы и, возможно, также в секции нижнего колонтитула), элемент строки таблицы ( ) определяет строки для данных, которые фактически представлены в таблице.Внутри каждой строки таблицы есть столько элементов таблицы (

), сколько ячеек в этой строке.

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

Структура таблицы HTML легче понять, если мы представляем ее, используя только базовую разметку контейнера, с некоторыми, надеюсь, освещающими комментарии, например:

Структура и последовательность разметки таблиц
 Таблица 6-1: Структура и последовательность разметки HTML

 Элемент 
 Описание 



 таблица 
 общий контейнер таблицы 


 подпись 
 текст заголовка таблицы 


 tbody 
 контейнер тела тела 


 tfoot 
 table footer container 



 Элемент 
 Описание

На рисунке показано, как браузер отображает эту таблицу. (Элемент border = "1" был добавлен в элемент таблицы, чтобы нарисовать контур вокруг края каждой ячейки таблицы, что делает таблицу немного лучше.)