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.
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.
Также стоит отметить, что если мы используем тег
, мы не обязаны использовать тегПример исходного кода с использованием тега
| Ячейка 1-1 | Ячейка 1-2 | Ячейка 1-3 |
|---|---|---|
| Ячейка 2-1 | Ячейка 2-2 | Ячейка 2-3 |
| Ячейка 3-1 | Ячейка 3-2 | Ячейка 3-3 |
Здесь я думаю все понятно. А вот про следующий HTML-тег следует всегда помнить.