<table> <tr> <th>...</th> <th>...</th> </tr> <tr> <td>...</td> <td>...</td> </tr> <tr> <td>...</td> <td>...</td> </tr> </table>
<table> <tr> <th>...</th> <td>...</td> <td>...</td> </tr> <tr> <th>...</th> <td>...</td> <td>...</td> </tr> </table>
<table> <tr> <th></th> <th>...</th> <th>...</th> </tr> <tr> <th>...</th> <td>...</td> <td>...</td> </tr> <tr> <th>...</th> <td>...</td> <td>...</td> </tr> </table>
Komórkę nagłówkową <th>...</th> wstawia się tak samo jak zwykłą komórka tabeli <td>...</td>. Różni się jedynie tym, że tekst do niej wpisany, jest napisany zwykle czcionką pogrubioną oraz ustawiony na środku (wyśrodkowany). Dlatego właśnie - jak sama nazwa wskazuje - komórka taka nadaje się do tworzenia nagłówka tabeli. Może się ona znajdować w dowolnym wierszu - nie tylko w pierwszym. Dodatkowo w wierszu takim mogą się znajdować również inne zwykłe komórki <td>...</td>. Dzięki temu możemy stworzyć pionowy nagłówek, znajdujący się np. na lewym brzegu tabeli.
Chociaż identyczny efekt wizualny można uzyskać odpowiednio zmieniając wygląd zwykłych komórek tabeli (<td align="center"><b>...</b></td>), to absolutnie taka metoda nie jest zalecana. Komórki nagłówkowe <th>...</th> oprócz efektu wizualnego niosą ze sobą ważne znaczenie semantyczne.
Przykład:
| A | B |
|---|---|
| komórka1 | komórka2 |
| komórka3 | komórka4 |
| 1 | komórka1 | komórka2 |
|---|---|---|
| 2 | komórka3 | komórka4 |
| A | B | |
|---|---|---|
| 1 | komórka1 | komórka2 |
| 2 | komórka3 | komórka4 |
Dla bardzo obszernych tabel, z dużą ilością komórek nagłówkowych, przydatne może się okazać, określenie atrybutu title="tekst" dla każdej zwykłej komórki <td>. Jako wartość tego atrybutu podajemy tekst, który powinien pojawić się na ekranie w dymku podpowiedzi, kiedy użytkownik wskaże myszką określoną komórkę tabeli. Można wpisać tam treść nagłówka, do którego należy dana komórka. Ułatwi to czytanie, jeśli komórki nagłówkowe znikną już z ekranu, z powodu zbyt długiej tabeli. Jest to bardzo przydatna funkcja zwłaszcza, jeśli tabela posiada dużo kolumn.
Przykład:
Wskaż myszką dowolną zwykłą komórkę poniższej tabeli:
| A | B | |
|---|---|---|
| 1 | komórka1 | komórka2 |
| 2 | komórka3 | komórka4 |
Przy okazji: zwróć uwagę na komórkę powyższej tabeli, która znajduje się w jej lewym-górnym rogu (na samym brzegu). Wygląda ona inaczej niż pozostałe, ponieważ nie posiada wewnętrznego obramowania. Dzieje się tak dlatego, bo nie ma tam żadnej treści. Jeśli chcemy to zmienić, należy wpisać do niej: . Jest to znak specjalny, oznaczający niełamliwą spację. Nie pojawi się on na ekranie, ale za to wprowadzi obramowanie do pustej komórki tabeli.
| A | B | |
|---|---|---|
| 1 | komórka1 | komórka2 |
| 2 | komórka3 | komórka4 |
W jaki sposób kontrolować marginesy wewnątrz tabeli?
Jak zmienić lub usunąć odstępy pomiędzy komórkami w tabeli?
Jak zmienić sposób ustawienia tekstu w tabeli?
Pomogła Ci ta strona? Chcesz, aby dalej się rozwijała?
Wpłać dobrowolną dotację...