Przejdź do treści

Tabele

Komórki nagłówkowe

  1. Nagłówek poziomy
    <table>
    <tr>
    	<th>...</th>	<th>...</th>
    </tr>
    <tr>
    	<td>...</td>	<td>...</td>
    </tr>
    <tr>
    	<td>...</td>	<td>...</td>
    </tr>
    </table>
  2. Nagłówek pionowy
    <table>
    <tr>
    	<th>...</th>	<td>...</td>	<td>...</td>
    </tr>
    <tr>
    	<th>...</th>	<td>...</td>	<td>...</td>
    </tr>
    </table>
  3. Nagłówek mieszany
    <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: &nbsp;. 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

Zobacz także

Więcej tematów

Dotacje

Pomogła Ci ta strona? Chcesz, aby dalej się rozwijała?
Dotpay - Bezpieczne transakcje internetowePayPalWpłać dobrowolną dotację...