HTML тег - table - определение и примеры использования
Меню
Веб-разработка
Тег table HTML

HTML - тег <table> определяет HTML таблицу и содержит другие элементы HTML, определяющие структуру таблицы.


Тег <table> - синтаксис и код

Тег <table> представлен парами. Содержимое записывается между открывающим (<table>) и закрывающим (</table>) тегами.

Пример простой HTML таблицы:

<table>
  <tr>
    <th>Имя</th>
    <th>Email</th>
    <th>Веб-сайт</th>
  </tr>
  <tr>
    <td>Эдуард</td>
    <td>example@mail.ru</td>
    <td>www.example.ru</td>
  </tr>
  <tr>
    <td>Александра</td>
    <td>example@mail.com</td>
    <td>www.example.com</td>
  </tr>
</table>
Имя Email Веб-сайт
Эдуард example@mail.ru www.example.ru
Александра example@mail.com www.example.com

Определение и использование

  • HTML - тег <table> определяет таблицу HTML;
  • Таблица HTML состоит из одного элемента <table> и одного или нескольких элементов <tr>, <th> и <td>;
  • Элемент <tr> определяет строку таблицы, элемент <th> определяет заголовок таблицы, а элемент <td> определяет ячейку таблицы.

Таблица HTML может также включать элементы <caption>, <colgroup>, <thead>, <tfoot> и <tbody>.

Рекомендация: тег <th> не является обязательным элементом таблицы, но его рекомендуется использовать, поскольку он помогает улучшить макет таблицы, а также помогает поисковым системам лучше индексировать содержимое таблицы.
Примечание: не рекомендуется использовать таблицы для верстки страниц. Для этого вы можете использовать CSS как альтернативу HTML таблицам.

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

Yandex Browser Поддерживает
Edge Поддерживает
Firefox Поддерживает
Safari Поддерживает
Opera Поддерживает

Атрибуты

Глобальные атрибуты

Тег <table> также поддерживает глобальные атрибуты в HTML

Атрибуты событий

Тег <table> также поддерживает атрибуты событий в HTML


Связанные страницы

Руководство по HTML: таблицы HTML


Настройки CSS по умолчанию

Большинство браузеров отображают элемент table со следующими значениями по умолчанию:

table {
  display: table;
  border-collapse: separate;
  border-spacing: 2px;
  border-color: gray;
}


Полный список всех доступных тегов HTML см. в Справочнике по тегам HTML.

 

Поделиться ссылкой