HTML apgūšana 22. daļa: Teādas, Tbody un Tfoot elementu izmantošana HTML tabulās
Rindas tabulā var sadalīttabulas tabulās, pēdu tabulās un tabulas tabulās, kas izteiktas ar teādas, pēdiņas un korpusa elementiem. Katrā tēmā, pēdiņā un tbody ir rindu grupa, un katrā grupā ir vismaz viena rinda, ko nosaka elements <tr>.
<thead>, <tofot> un <tbody> elementi būs ļoti labinoderīgi, rakstot garu, platu tabulu, kurai ir vairāk nekā viena lapa, kurā ir uzrakstīta arī katra no lappusēm, galviņas un kāju galdi. Šo trīs elementu izmantošana palīdzēs jums sakārtot tabulu, kā vēlaties, izmantojot CSS stilu, un tas neietekmēs tabulas izkārtojumu. Lai iegūtu sīkāku informāciju, ņemsim vērā skaidrojumu zemāk:
Tadas elements
Thead elements tiek izmantots satura grupēšanaivai saturs, kas atrodas tabulas augšpusē (galviņā). Tags <thead> ir uzrakstīts kā <table> elementa apakšbjekts, kas nozīmē, ka tas atrodas <table> elementa iekšpusē pēc <caption> un <colgroup> elementiem vai pirms <tfoot>, <tbody> un <tr>.
Tiek izmantots elements <thead> kopā ar elementu <tbody>, kas parāda tabulas saturu, un <tfoot>, kas parāda tabulas apakšdaļu (pēdas).
HTML5 nav īpašu atribūtuvar izmantot <thead> elementiem, savukārt HTML4.01 ir vairāki atribūti, proti, izlīdzināt, bgcolor, char, charoff un valign. Tomēr šie atribūti ir novecojuši, un, lai iestatītu elementu <thead>, jums vajadzētu izmantot tikai CSS.
Ķermeņa elements
Grupas izveidošanai izmanto elementu tbodysaturs vai saturs, kas atrodas tabulas vidū (pamattekstā). <Tbody> tags ir jāiekļauj, ja vien tabulā nav tikai viena ķermeņa galda un tajā nav galvas vai kājas galda.
Lietošanā elements <tbody> tiek izmantots kopā ar elementu <thead>, kas parāda tabulas augšdaļu (galvu), un <tfoot>, kas parāda tabulas apakšdaļu (pēdas).
HTML5 formātā nav īpašu atribūtuvar izmantot <tbody> elementiem, savukārt HTML4.01 ir vairāki atribūti, proti, izlīdzināt, bgcolor, char, charoff un valign. Tomēr šie atribūti ir novecojuši, un, lai iestatītu elementu <tbody>, jums vajadzētu izmantot tikai CSS.
Pēdas elements
Tfoot elements tiek izmantots satura grupēšanaivai saturs tabulas apakšā (pēdās). Lietošanā elements <tfoot> tiek izmantots kopā ar elementu <tbody>, kas parāda tabulas saturu, un <thead>, kas parāda tabulas augšdaļu (galvu). Sākuma tags <tfoot> ir iekļauts, ja ir pēdējās tabulas un noslēdzošo tagu <foot> var ignorēt.
HTML5 nav īpašu atribūtuvar izmantot elementam <pēd>, savukārt HTML4.01 ir vairāki atribūti, proti, izlīdzināt, bgcolor, char, charoff un valign. Tomēr šie atribūti ir novecojuši, un, lai iestatītu elementu <tbody>, jums vajadzētu izmantot tikai CSS.
Jāatceras tikai tas, ka teādam, tbody un pēdai ir jābūt vienādam skaitam kolonnu. Šis ir šo trīs elementu rakstīšanas un izmantošanas koda HTML piemērs:
<!DOCTYPE html>
<html>
<head>
<title>Penggunaan Grup Baris di HTML</title>
<style type="text/css">
table,th, td {
border: 1px solid black;
border-collapse: collapse;
width: 20%; }
tfoot { border:3px solid red; }
</style>
</head>
<body>
<table>
<tfoot> <!-- Meskipun elemen tfoot diletakkan di paling depan, hasilnya di browser berada di paling bawah>
<tr>
<td>Rata-Rata</td>
<td>16</td>
</tr>
</tfoot>
<tbody>
<tr>
<td>011402001</td>
<td>15</td>
</tr>
<tr>
<td>011402002</td>
<td>17</td>
</tr>
</tbody>
<thead>
<tr>
<th>NIM</th>
<th>Poin</th>
</tr>
</thead>
</table>
</body>
</html>
Rezultāti šādā pārlūkprogrammā:
Kā redzat no iepriekš redzamā HTML koda,lai arī es ievietoju tfoot elementu priekšpusē (pēc atvēršanas taga <table>), pārlūkprogrammā rezultāti būs apakšā, jo šī tfoot elementa funkcija grupē šūnu saturu vai saturu tabulas apakšā. Tāpat kā ar elementa elementu, kas sadala šūnu saturu tabulas sākumā (galviņā), un ķermeņa elementu tabulas vidū.
Kā? Vai jūs saprotat šo trīs elementu funkcijas? Ja jūs jau saprotat, lūdzu, pārejiet pie nākamā materiāla par kolu, sagrupējumu un parakstu tagu izmantošanu.