în HTML

Tabele HTML 2.0+

Containerul principal pentru afișarea datelor tabelare structurate pe rânduri și coloane.

Sintaxă tag

<table>
  <tr>
    <th>Antet</th>
  </tr>
  <tr>
    <td>Date</td>
  </tr>
</table>

Ce face <table>

Tagul <table> se folosește strict pentru afișarea datelor bidimensionale: prețuri, orare, clasamente, specificații tehnice sau liste de utilizatori.

Un tabel bine structurat conține rânduri (<tr>), celule de antet (<th>), celule de date (<td>) și poate fi organizat pe secțiuni logice cu <thead>, <tbody> și <tfoot>.

Exemple

Exemplul 1: Tabel de prețuri simplu

Datele sunt aliniate în căsuțe pe linii și coloane.

<table border="1">
  <tr>
    <th>Produs</th>
    <th>Preț</th>
  </tr>
  <tr>
    <td>Curs HTML</td>
    <td>Gratuit</td>
  </tr>
  <tr>
    <td>Certificare</td>
    <td>150 lei</td>
  </tr>
</table>

Ce afișează browserul

+---------------+----------+
| Produs        | Preț     |
+---------------+----------+
| Curs HTML     | Gratuit  |
| Certificare   | 150 lei  |
+---------------+----------+

Greșeli frecvente

• Folosirea tabelelor pentru a aranja layout-ul general al paginii (header, sidebar, footer); layout-ul se realizează exclusiv cu CSS Flexbox și CSS Grid, tabelele fiind rezervate strict datelor.

Comenzi înrudite

• <thead>, <tbody> și <tfoot>: Împarte tabelul în trei secțiuni semantice: antetul cu titlurile coloanelor, corpul cu datele și subsolul cu totalurile.
• <tr>: Definește un rând orizontal (table row) în interiorul unui tabel.
• <th>: Celulă de antet într-un tabel: textul este afișat implicit îngroșat și centrat.
• <td>: Celulă standard de date (table data) într-un tabel HTML.