W dokumencie HTML możemy przedstawiać dane (informacje) w postaci tabeli. Do opisania tabeli używamy następujących znaczników:
| Znacznik | Opis znacznika |
|---|---|
| <table> | Początek tabeli (ang. table – tabela). |
| </table> | Koniec tabeli. |
| <caption> | Początek podpisu tabeli (ang. caption podpis). |
| </caption> | Koniec podpisu tabeli. |
| <tr> | Początek wiersza tabeli (ang. table row – wiersz tabeli). |
| </tr> | Koniec wiersza tabeli. |
| <th> | Początek komórki w nagłówku tabeli (ang. table header – nagłówek tabeli). |
| </th> | Koniec komórki tabeli w nagłówku tabeli. |
| <td> | Początek komórki tabeli z danymi (ang. table data – dane tabeli). |
| </td> | Koniec komórki tabeli z danymi. |
Początkowo w znaczniku rozpoczynającym opis tabeli umieściłem parametr border (<table border>), który powoduje że widoczne są granice (obramowanie) całej tabeli i wszystkich komórek. Ten parametr ma domyślną wartość 1 (grubość krawędzi tabeli 1px) i jest interpretowany przez przeglądarki poprawnie, ale nie jest zalecany. Obecnie zaleca się formatowanie tabeli za pomocą stylu: table { border: 1px solid black; } (linia o grubości 1px, ciągła, kolor czarny). Podobnie należałoby wpisać styl do każdego znacznika <th> i <th>, a to mogłoby być zbyt uciążliwe i wydłużyłoby niepotrzebnie kod strony. Problemu nie będzie, gdy w sekcji <head> wstawimy znacznik <style> nadamy znacznikom odpowiednie style.
Pomiędzy znacznikiem <table> a początkiem pierwszego wiersza tabeli <tr> można wstawić znacznik <caption>...</caption> z opisem tabeli. Domyślnie opis umieszczony jest centralnie nad tabelą, ale za pomocą stylu można to zmienić.
W nagłówku tabeli (tu w pierwszym wierszu) zastosowano znaczniki <th> i w stylu domyślnym zawartość komórki nagłówkowej jest wyśrodkowana i wyróżniona za pomocą pogrubienia. Komórki utworzone za pomocą znaczników <td> domyślnie mają styl pisma normalny i wyrównanie zawartości do lewej strony. To można zmienić stosując style.
Szerokość kolumn tabeli i całej tabeli dostosowuje się do zawartości komórek.
| Znacznik | Opis znacznika |
|---|---|
| <thead> | Początek grupy wierszy tworzących nagłówek tabeli (ang. table header). |
| </thead> | Koniec grupy wierszy tworzących nagłówek tabeli. |
| <tfoot> | Początek grupy wierszy tworzących stopkę tabeli (ang. table footer). Przeglądarka automatycznie umieszcza stopkę na końcu tabeli. |
| </tfoot> | Koniec grupy wierszy tworzących nagłówek tabeli. |
| <tbody> | Początek grupy wierszy tworzących ciało tabeli (ang. table body). |
| </tbody> | Koniec grupy wierszy tworzących ciało tabeli. |