Learning HTML Part 22: Χρήση των στοιχείων Thead, Tbody και Tfoot σε πίνακες HTML
Οι σειρές στον πίνακα μπορούν να διαχωριστούνστα τραπέζια, στους πίνακες tfoot και στους πίνακες tbody που εκφράζονται από τα στοιχεία thead, tfoot και tbody. Κάθε thead, tfoot και tbody περιέχουν μια ομάδα γραμμών και κάθε ομάδα περιέχει τουλάχιστον μία σειρά που ορίζεται από το στοιχείο <tr>.
Τα στοιχεία <thead>, <tfoot> και <tbody> θα είναι πολύχρήσιμο γράφοντας έναν πίνακα που είναι μακρύς, ευρύς και έχει περισσότερες από μία σελίδες όπου κάθε μία από τις σελίδες, το κεφάλι και τα τραπέζια ποδιών γράφονται επίσης. Η χρήση αυτών των τριών στοιχείων θα σας βοηθήσει να οργανώσετε το τραπέζι όπως επιθυμείτε χρησιμοποιώντας στυλ CSS και δεν θα επηρεάσει τη διάταξη ενός πίνακα. Για περισσότερες λεπτομέρειες, εξετάστε την παρακάτω εξήγηση:
Στοιχείο του
Το στοιχείο Thead χρησιμοποιείται για την ομαδοποίηση των περιεχομένωνή το περιεχόμενο που βρίσκεται στην κορυφή (κεφάλι) σε έναν πίνακα. Η ετικέτα <thead> γράφεται ως στοιχείο παιδιού του στοιχείου <table> που σημαίνει ότι βρίσκεται μέσα στο στοιχείο <table> μετά τα στοιχεία <caption> και <colgroup> ή πριν από τα <tfoot>, <tbody> και <tr>.
Κατά τη χρήση, το στοιχείο <thead> χρησιμοποιείται μαζί με το στοιχείο <tbody> που δείχνει τα περιεχόμενα του πίνακα και το <tfoot> που δείχνει το κάτω (πόδια) ενός πίνακα.
Στην HTML5 δεν υπάρχουν ειδικά χαρακτηριστικάμπορεί να χρησιμοποιηθεί για <thead> στοιχεία ενώ στο HTML4.01 υπάρχουν πολλά χαρακτηριστικά, δηλαδή ευθυγράμμιση, bgcolor, char, charoff, και valign. Ωστόσο, αυτά τα χαρακτηριστικά είναι παρωχημένα και θα πρέπει να χρησιμοποιήσετε το CSS μόνο για να ορίσετε το στοιχείο <thead>.
Στοιχείο tbody
Το στοιχείο tbody χρησιμοποιείται για την ομαδοποίησηπεριεχόμενο ή περιεχόμενο που βρίσκεται στη μέση (σώμα) ενός πίνακα. Η ετικέτα <tbody> πρέπει να συμπεριληφθεί εκτός εάν ο πίνακας περιέχει μόνο ένα τραπέζι σώματος και δεν έχει τραπέζι κεφαλιού ή ποδιού.
Κατά τη χρήση, το στοιχείο <tbody> χρησιμοποιείται μαζί με το στοιχείο <thead> που δείχνει την κορυφή του πίνακα και το <tfoot> που δείχνει το κάτω μέρος των ποδιών ενός τραπεζιού.
Στην HTML5 δεν υπάρχουν ειδικά χαρακτηριστικάμπορεί να χρησιμοποιηθεί για στοιχεία <tbody> ενώ στο HTML4.01 υπάρχουν πολλά χαρακτηριστικά, δηλαδή ευθυγράμμιση, bgcolor, char, charoff και valign. Ωστόσο, αυτά τα χαρακτηριστικά είναι παρωχημένα και θα πρέπει να χρησιμοποιήσετε το CSS μόνο για να ορίσετε το στοιχείο <tbody>.
Στοιχείο Tfoot
Το στοιχείο tfoot χρησιμοποιείται για την ομαδοποίηση των περιεχομένωνή περιεχόμενο στο κάτω μέρος (πόδια) ενός πίνακα. Κατά τη χρήση, το στοιχείο <tfoot> χρησιμοποιείται μαζί με το στοιχείο <tbody> που δείχνει τα περιεχόμενα του πίνακα και το <thead> που δείχνει την κορυφή ενός πίνακα. Η ετικέτα ανοίγματος <tfoot> περιλαμβάνεται εάν υπάρχει ο πίνακας tfoot και η ετικέτα κλεισίματος <tfoot> μπορεί να αγνοηθεί.
Στην HTML5 δεν υπάρχουν ειδικά χαρακτηριστικάμπορεί να χρησιμοποιηθεί για το στοιχείο <tfoot> ενώ στο HTML4.01 υπάρχουν πολλά χαρακτηριστικά, δηλαδή ευθυγράμμιση, bgcolor, char, charoff και valign. Ωστόσο, αυτά τα χαρακτηριστικά είναι παρωχημένα και θα πρέπει να χρησιμοποιήσετε το CSS μόνο για να ορίσετε το στοιχείο <tbody>.
Το πράγμα που πρέπει να θυμόμαστε είναι ότι ο τύπος πρέπει να περιέχει τον ίδιο αριθμό στηλών. Το παρακάτω είναι ένα παράδειγμα του κώδικα για τη γραφή και τη χρήση αυτών των τριών στοιχείων σε HTML:
<!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>Τα αποτελέσματα σε ένα πρόγραμμα περιήγησης όπως αυτό:
Όπως μπορείτε να δείτε από τον παραπάνω κώδικα HTML,αν και έβαλα το στοιχείο tfoot στο μπροστινό μέρος (μετά την ετικέτα ανοίγματος <table>), στο πρόγραμμα περιήγησης τα αποτελέσματα θα είναι στο κάτω μέρος επειδή η λειτουργία αυτού του στοιχείου tfoot ομαδοποιεί τα περιεχόμενα των κελιών ή των περιεχομένων στο κάτω μέρος του πίνακα. Ομοίως με το στοιχείο που ομαδοποιεί τα περιεχόμενα κυττάρων στην αρχή (το κεφάλι) του πίνακα και το στοιχείο tbody στο κέντρο του πίνακα.
Πώς να το κάνετε; Καταλαβαίνετε τη λειτουργία αυτών των τριών στοιχείων; Αν έχετε ήδη καταλάβει, προχωρήστε στο επόμενο υλικό σχετικά με τη χρήση των ετικετών col, colgroup και caption.
