Tag tfoot
Tag tfoot menentukan bahagian bawah jadual.
Digunakan untuk mengumpulkan baris dengan
cara yang membolehkan gaya CSS digunakan
terus kepada sekumpulan baris. Hanya satu tag
tfoot dibenarkan dalam satu jadual.
Tag tfoot sering digunakan bersama
dengan thead
dan tbody
untuk menentukan bahagian atas, bahagian utama,
dan bahagian bawah jadual HTML. Secara lalai,
penyemak imbas akan meletakkan kandungan
tfoot di bahagian bawah jadual, dan
thead di bahagian atas.
Contoh
Mari berikan warna merah teks kepada kumpulan
baris yang dikumpulkan oleh tag
tfoot menggunakan sifat
color:
<table>
<thead>
<tr>
<th>Name</th>
<th>Surn</th>
<th>Salary</th>
</tr>
</thead>
<tbody>
<tr>
<td>name1</td>
<td>surn1</td>
<td>200$</td>
</tr>
<tr>
<td>name2</td>
<td>surn2</td>
<td>1000$</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>count: 2</td>
<td>-</td>
<td>total: 1200$</td>
</tr>
</tfoot>
</table>
tfoot {
color: red;
}
table, td, th {
border: 1px solid black;
}
:
Contoh
Di sini, mari kita lihat, thead
bukan terletak di bahagian atas, dan
tfoot bukan di bahagian bawah,
namun penyemak imbas tetap meletakkannya
di kedudukan yang sepatutnya:
<table>
<tfoot>
<tr>
<td>count: 2</td>
<td>-</td>
<td>total: 1200$</td>
</tr>
</tfoot>
<tbody>
<tr>
<td>name1</td>
<td>surn1</td>
<td>200$</td>
</tr>
<tr>
<td>name2</td>
<td>surn2</td>
<td>1000$</td>
</tr>
</tbody>
<thead>
<tr>
<th>Name</th>
<th>Surn</th>
<th>Salary</th>
</tr>
</thead>
</table>
tfoot {
color: red;
}
table, td, th {
border: 1px solid black;
}
: