Tablo görsel yapısı
Yardımcı etiketlerle tablo yapısını netleştirirsin.
Tablonun mantıksal bölümleri
HTML tablosu mantıksal bölümlere ayrılır: <thead> başlık satırını, <tbody> asıl veriyi, <tfoot> ise özet ya da toplam satırını taşır.
Bu üç bölüm tabloyu hem görsel hem erişilebilirlik açısından düzenler. <tfoot> teknik olarak <thead>'den hemen sonra da yazılabilir; ama en sık karşılaşılan yer <tbody>'den sonra, tablonun en sonudur. Bu ders bu sırayı uygulayacağız.
Görsel sıra
Tablonun görsel sırası şöyledir: önce <caption>, sonra <colgroup>, sonra <thead>, <tbody> ve en son <tfoot>.
<caption> her zaman tablonun ilk çocuğu olmalıdır; aksi halde ekran okuyucular başlığı tabloyla ilişkilendiremez. <colgroup> ise <caption>'dan sonra, <thead>'den önce yer alır. Bu sıra hem HTML standardına hem de görsel beklentiye uyar.
Uygulama Sıralı tablo görsel yapısını kur
Tablonun görsel sırasını kur. <table> içine sırayla şunları ekle: dolu bir <caption>, bir <colgroup> (içinde en az bir <col>), <thead> (içinde <th scope="col">), <tbody> (içinde <td>) ve en son <tfoot> (içinde <td>).
Örnek çözümü göster
<table>
<caption>Çeyrek Bilanço</caption>
<colgroup>
<col>
<col>
</colgroup>
<thead>
<tr>
<th scope="col">Kalem</th>
<th scope="col">Tutar</th>
</tr>
</thead>
<tbody>
<tr>
<td>Gelir</td>
<td>₺1,2M</td>
</tr>
<tr>
<td>Gider</td>
<td>₺0,8M</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>Açık</td>
<td>₺0,4M</td>
</tr>
</tfoot>
</table>Kendini test et
-
tfoot etiketi en sık nereye yerleşir?
- caption'dan önce
- tbody'den sonra, tablonun sonunda
- table'ın dışında
- colgroup'un içinde
Cevabı göster
tbody'den sonra, tablonun sonunda — Doğru. tfoot en sık tbody'den sonra, tablonun en sonunda yer alır.
-
caption'dan sonra ne gelir?
<table> <caption>Sipariş Özeti</caption> ____> <col> <col> </colgroup> <thead>...</thead> </table>Cevabı göster
<table> <caption>Sipariş Özeti</caption> <colgroup>> <col> <col> </colgroup> <thead>...</thead> </table> -
Öğeyi konumuyla eşleştir
- caption
- İlk çocuk
- colgroup
- caption'dan sonra
- thead
- colgroup'tan sonra
- tfoot
- En son