<!-->
<!DOCTYPE>
<a>
<abbr>
<acronym>
<address>
<applet>
<area>
<article> (HTML5)
<aside>(HTML5)
<audio> (HTML5)
<b>
<base>
<basefont>
<bdo>
<big>
<blockquote>
<body>
<br>
<button>
<canvas> (HTML5)
<caption>
<center>
<cite>
<code>
<col>
<colgroup>
<command> (HTML5)
<datalist> (HTML5)
<dd>
<del>
<details> (HTML5)
<dfn>
<dir>
<div>
<dl>
<dt>
<em>
<embed> (HTML5)
<fieldset>
<figcaption> (HTML5)
<figure> (HTML5)
<font>
<footer> (HTML5)
<form>
<frame>
<frameset>
<h1> - <h6>
<head>
<header> (HTML5)
<hgroup> (HTML5)
<hr>
<html>
<i>
<iframe>
<img>
<input>
<ins>
<keygen> (HTML5)
<kbd>
<label>
<legend>
<li>
<link>
<map>
<mark> (HTML5)
<menu>
<meta>
<meter> (HTML5)
<nav> (HTML5)
<noframes>
<noscript>
<object>
<ol>
<optgroup>
<option>
<output> (HTML5)
<p>
<param>
<pre>
<progress> (HTML5)
<q>
<rp> (HTML5)
<rt> (HTML5)
<ruby> (HTML5)
<s>
<samp>
<script>
<section> (HTML5)
<select>
<small>
<source> (HTML5)
<span>
<strike>
<strong>
<style>
<sub>
<summary> (HTML5)
<sup>
<table>
<tbody>
<td>
<textarea>
<tfoot>
<th>
<thead>
<time> (HTML5)
<title>
<tr>
<tt>
<u>
<ul>
<var>
<video> (HTML5)
<wbr> (HTML5)
Η ετικέτες <thead> <tfoot> και <tbody> - Υποδιαιρέσεις του πίνακα
Ορισμός και χρήση
Με την ετικέτα <thead> ορίζουμε την επικεφαλίδα του πίνακα

Με την ετικέτα <tfoot> ορίζουμε το υποσέλιδο του πίνακα.

Με την ετικέτα <tbody> ορίζουμε τις γραμμές που βρίσκονται μέσα στις ετικέτες <tbody> και </tbody> ως το κυρίως περιεχόμενο του πίνακα.

Οι ετικέτες <thead> <tfoot> και <tbody> μας δίνουν την δυνατότητα να ομαδοποιήσουμε τις γραμμές ενός πίνακα. Όταν δημιουργούμε έναν πίνακα, συνήθως έχουμε στην αρχή μια γραμμή που τοποθετούμε τις επικεφαλίδες του πίνακα (header), έπειτα κάποιες γραμμές με δεδομένα (body, το κυρίως μέρος του πίνακα) και στο τέλος μια γραμμή με τα συνολικά αποτελέσματα (footer, υποσέλιδο του πίνακα). Με αυτή την διαίρεση του πίνακα o browser μπορεί να κάνει scrolling στις γραμμές όπου βρίσκεται το κυρίως περιεχόμενο του πίνακα (το οποίο ορίζεται με την ετικέτα <tbody>) ανεξάρτητα από το header του πίνακα (το οποίο ορίζεται με την ετικέτα <thead>), και το footer (το οποίο ορίζεται με την ετικέτα <tfoot>). Επίσης όταν εκτυπώνουμε μεγάλους πίνακες που επεκτείνονται σε περισσότερες από μια σελίδες, η γραμμές header και footer των πινάκων θα τυπώνονται σε κάθε σελίδα

Σε περίπτωση που θέλουμε να ομαδοποιήσουμε τις γραμμές του πίνακα μας με τον παραπάνω τρόπο, δεν μπορούμε να χρησιμοποιήσουμε μόνο μια ή δύο από τις ετικέτες <thead> <tfoot> και <tbody>. Πρέπει να τις χρησιμοποιούμε όλες και με την συγκεκριμένη σειρά : <thead> <tfoot> <tbody>. Αν και η ετικέτα <tfoot> τοποθετείται πριν την ετικέτα <tbody> στην οθόνη του browser εμφανίζονται πρώτα οι γραμμές που ορίζουν οι ετικέτες <tbody> και </tbody> και μετά εμφανίζεται η γραμμή που ορίζουν οι ετικέτες <tfoot> και </tfoot>

Όλα τα παραπάνω είναι πολύ ωραία και θα ήταν ακόμα ομορφότερα εάν υποστηριζόταν από όλους τους browsers. Πάντως το πρότυπο της HTML έχει την πεποίθηση ότι αυτό θα αλλάξει στο μέλλον. Μέχρι τότε καλύτερα να ψάχνουμε σκριπτάκια αν θέλουμε scrolling στους πίνακες μας
Παράδειγμα
Πηγαίος Κώδικας Αποτέλεσμα στον browser
<table border = "1">
<thead>
<tr>
<td>Περιεχόμενο μέσα στο THEAD</td>
</tr>
</thead>
<tfoot>
<tr>
<td>Περιεχόμενο μέσα στο TFOOT</td>
</tr>
</tfoot>
<tbody>
<tr>
<td>Περιεχόμενο μέσα στο TBODY</td>
</tr>
</tbody>
</table>
Περιεχόμενο μέσα στο THEAD
Περιεχόμενο μέσα στο TFOOT
Περιεχόμενο μέσα στο TBODY
Κοινές (standard) ιδιότητες που μπορεί να πάρει η ετικέτα:
Καμία από τις ιδιότητες της HTML 4.01, δεν υποστηρίζεται στην HTML5
Ιδιότητες
Ιδιότητα Τιμή Περιγραφή
align right
left
center
justify
char
ΔΕΝ ΣΥΜΠΕΡΙΛΑΜΒΑΝΕΤΑΙ ΣΤΗΝ HTML5
Ορίζει την οριζόντια στοίχιση του περιεχομένου μέσα στα κελιά της γραμμής
bgcolor rgb(x,x,x)
#xxxxxx
colorname
Περισσότερα για τα χρώματα
ΔΕΝ ΣΥΜΠΕΡΙΛΑΜΒΑΝΕΤΑΙ ΣΤΗΝ HTML5
Ορίζει το χρώμα του φόντου των κελιών της γραμμής του πίνακα
char χαρακτήρας ΔΕΝ ΣΥΜΠΕΡΙΛΑΜΒΑΝΕΤΑΙ ΣΤΗΝ HTML5
Ορίζει έναν χαρακτήρα στον οποίο θα στοιχίζεται η γραμμή (Χρησιμοποιείται μόνο όταν align="char")
charoff pixels
%
ΔΕΝ ΣΥΜΠΕΡΙΛΑΜΒΑΝΕΤΑΙ ΣΤΗΝ HTML5
Ορίζει την απόσταση εως τον τον πρώτο χαρακτήρα στοίχισης σε μια γραμμή (Χρησιμοποιείται μόνο όταν align="char")
valign top
middle
bottom
baseline
ΔΕΝ ΣΥΜΠΕΡΙΛΑΜΒΑΝΕΤΑΙ ΣΤΗΝ HTML5
Ορίζει την κάθετη στοίχιση του περιεχομένου των κελιών της γραμμής του πίνακα
Κοινές (standard) ιδιότητες που μπορεί να πάρει η ετικέτα:
Και οι τρεις ετικέτες υποστηρίζουν τις standard ιδιότητες της HTML5
HTML Γεγονότα που μπορεί να πάρει η ετικέτα:
Και οι τρεις ετικέτες υποστηρίζουν τις ιδιότητες events της HTML5