Основы таблиц HTML

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

<table>
  <caption>Weekly plan</caption>
  <tr><th>Day</th><th>Task</th></tr>
  <tr><td>Mon</td><td>HTML</td></tr>
  <tr><td>Tue</td><td>CSS</td></tr>
</table>

Если ячейка должна занять несколько столбцов, используют colspan, несколько строк — rowspan. Число показывает, сколько ячеек объединено.

<table>
  <tr><th colspan="2">Prices</th></tr>
  <tr><td>Tea</td><td>1.00</td></tr>
  <tr><td rowspan="2">Cake</td><td>3.50</td></tr>
  <tr><td>4.00</td></tr>
</table>

Длинные таблицы делите на <thead>, <tbody> и <tfoot>. Запись scope="col" или scope="row" у <th> сообщает экранному диктору, к чему относится заголовок. <caption> задаёт название таблицы.

<table>
  <caption>Scores</caption>
  <thead><tr><th scope="col">Name</th><th scope="col">Points</th></tr></thead>
  <tbody>
    <tr><th scope="row">Aysel</th><td>92</td></tr>
    <tr><th scope="row">Murad</th><td>88</td></tr>
  </tbody>
</table>

• Оформление (рамки, цвета) задавайте через CSS, а не атрибутами HTML.