Element <table> w HTML

Element <table> w HTML

Element <table> służy do tworzenia tabel w dokumencie HTML. Tabela składa się z wierszy oraz komórek. W egzaminach często trzeba przeanalizować kod tabeli i wskazać jej poprawny wygląd.

Podstawowa struktura tabeli

Najważniejsze elementy tabeli to:

• <table> - rozpoczyna i kończy tabelę,
• <tr> - tworzy wiersz tabeli,
• <td> - tworzy zwykłą komórkę danych,
• <th> - tworzy komórkę nagłówkową.

Przykład:

<table>
  <tr>
    <td>A</td>
    <td>B</td>
  </tr>
  <tr>
    <td>C</td>
    <td>D</td>
  </tr>
</table>

Powyższy kod tworzy tabelę z 2 wierszami i 2 kolumnami.

Łączenie komórek

W tabelach można łączyć komórki:

• colspan - łączy komórki poziomo, czyli przez kilka kolumn,
• rowspan - łączy komórki pionowo, czyli przez kilka wierszy.

Przykład:

<td rowspan="2">tekst</td>

Taka komórka zajmuje wysokość dwóch wierszy.

Atrybuty wyglądu tabeli

W starszym HTML spotyka się atrybuty:

• border - grubość obramowania,
• cellspacing - odstęp między komórkami,
• cellpadding - odstęp między treścią komórki a jej obramowaniem.

W nowoczesnych stronach wygląd tabeli zaleca się ustawiać za pomocą CSS, np. border, padding i border-spacing.