HTML Заголовки таблицы
HTML таблицы могут иметь заголовки для каждого столбца или строки или для многих столбцов/строк.
| EMIL | TOBIAS | LINUS |
|---|---|---|
| 8:00 | ||
|---|---|---|
| 9:00 | ||
| 10:00 | ||
| 11:00 | ||
| 12:00 | ||
| 13:00 |
| MON | TUE | WED | THU | FRI | |
|---|---|---|---|---|---|
| 8:00 | |||||
| 9:00 | |||||
| 10:00 | |||||
| 11:00 | |||||
| 12:00 |
| DECEMBER | ||
|---|---|---|
Заголовки таблиц
Заголовки таблиц определяются с помощью th. Каждый th представляет ячейку таблицы.
<table>
<tr>
<th>Имя</th>
<th>Фамилия</th>
<th>Год</th>
</tr>
<tr>
<td>Андрей</td>
<td>Щипунов</td>
<td>50</td>
</tr>
<tr>
<td>Татьяна</td>
<td>Щипунова</td>
<td>94</td>
</tr>
</table>
Попробуйте сами »
Вертикальные заголовки таблиц
Чтобы использовать первый столбец в качестве заголовков таблицы, определите первую ячейку в каждой строке элемента
<th>:
<table>
<tr>
<th>Имя</th>
<td>Андрей</td>
<td>Татьяна</td>
</tr>
<tr>
<th>Фамилия</th>
<td>Щипунов</td>
<td>Щипунова</td>
</tr>
<tr>
<th>Год</th>
<td>94</td>
<td>50</td>
</tr>
</table>
Попробуйте сами »
Выровнивание заголовка таблицы
По умолчанию заголовки таблиц выделены жирным шрифтом и по центру:
| Имя | Фамилия | Год |
|---|---|---|
| Андрей | Щипунов | 50 |
| Татьяна | Щипунова | 94 |
Чтобы выровнять заголовки таблиц по левому краю, используйте свойство CSS text-align:
th {
text-align: left;
}
Попробуйте сами »
Заголовок для нескольких столбцов
У вас может быть заголовок, охватывающий два или более столбца.
| Имя | Год | |
|---|---|---|
| Андрей | Щипунов | 50 |
| Татьяна | Щипунова | 94 |
Для этого используйте атрибут colspan для элемента <th>:
<table>
<tr>
<th colspan="2">Имя</th>
<th>Год</th>
</tr>
<tr>
<td>Андрей</td>
<td>Щипунов</td>
<td>50</td>
</tr>
<tr>
<td>Татьяна</td>
<td>Щипунова</td>
<td>94</td>
</tr>
</table>
Попробуйте сами »
Вы узнаете больше о colspan и rowspan в главе Таблица colspan и rowspan.
Заголовок таблицы
Вы можете добавить заголовок, который служит заголовком для всей таблицы.
| Месяц | Сбережения |
|---|---|
| Январь | $100 |
| Февраль | $50 |
Чтобы добавить заголовок к таблице, используйте тег <caption>:
<table style="width:100%">
<caption>Ежемесячная экономия</caption>
<tr>
<th>Месяц</th>
<th>Сбережения</th>
</tr>
<tr>
<td>Январь</td>
<td>$100</td>
</tr>
<tr>
<td>Февраль</td>
<td>$50</td>
</tr>
</table>
Попробуйте сами »
Примечание: Тег <caption> следует вставлять сразу после тега <table>.