Опубликовано: 25.06.2010 Последняя правка: 10.12.2015
HTMLXHTML
IEChromeFireFoxOperaSafari

Тег <TABLE>

Тег <TABLE> определяет базовый элемент таблицы, который содержит все остальные табличные теги. Причем большинство этих тегов не являются обязательными и далеко не всегда используются. Для создания обычной таблицы вполне достаточно, чтобы <TABLE> содержал элементы <TR>, которые в свою очередь содержали теги <TD> или <TH>.

Изначально спецификацией HTML предполагалось, что таблицы будут использоваться только по их прямому назначению — отображению табличных данных. Но находчивые HTML-верстальщики быстро нашли им совсем другое применение — использование в глобальной разметке веб-страниц. И по сегодняшний день табличная верстка является самой распространенной в интернете ввиду простоты, удобства и предсказуемости поведения (особенно, если говорить о «трехколоночных» макетах). Конечно, давно уже имеется верстка слоями («на DIV-ах»), но до сих пор во всех уголках интернета идут ожесточенные споры меж приверженцами обоих способов, которым нет конца.

Атрибуты

Личные атрибуты:

Общие атрибуты:

Тип тега

Назначение: таблицы.

Модель тега: block (блочный, уровня блока).

Должен содержать: теги <TBODY> или <TR>, но не оба варианта одновременно.

Может содержать: по одному тегу <CAPTION>, <THEAD>, <TFOOT>, в любом количестве теги <COL> или <COLGROUP>.

Открывающий тег: необходим. Закрывающий тег: необходим.

Синтаксис

<table>
 <tr>
  <td>содержимое<td>
 </tr>
</table>

Пример HTML: применение тега TABLE

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <title>seodon.ru - Применение тега TABLE</title>
 </head>
 <body>
  <table cellspacing="0" cellpadding="5" bgcolor="#66cc00" width="100%">
   <tr valign="top"><td height="50">Хедер</td></tr>
   <tr><td bgcolor="#cc0066">Вспомогательная навигация</td></tr>
  </table>
  <table cellspacing="0" cellpadding="5" bgcolor="#66cc00" width="100%">
   <tr valign="top">
    <td width="150" height="350">Меню сайта</td>
    <td bgcolor="#ffffff">Основное содержимое</td>
    <td width="100">Дополнительное меню</td>
   </tr>
   <tr><td colspan="3" bgcolor="#999999">Футер</td></tr>
  </table>
 </body>
</html>

Результат примера

Поддержка версиями HTML

Версия:HTML 4.01HTML 5XHTML 1.0XHTML 1.1
Поддержка:ДаДаДаДа

Поддержка браузерами

Браузер:Internet ExplorerGoogle ChromeMozilla FirefoxOperaSafari
Версия:6.0 и выше2.0 и выше2.0 и выше9.2 и выше3.1 и выше
Поддержка:ДаДаДаДаДа