< html> < !-- ξεκιναει ο html κώδικας.-->
< body> < !-- ξεκινάει το περιεχόμενο της σελίδας. -->
< table < !-- Οριζουμε έναν πίνακα με τo tag < table >. -->
width="600" < !-- Με την εντολή αυτή ορίζουμε το οριζόντιο πλάτος του πίνακα.-->
border="2" < !--βάζω διαφορα περιγράματα μπορώ να αλλάζω νουμερα για να έχω διαφορετικά περιγράμματα -->
< !--Αντι του border μπορω να βάλω την εντολη frame="box" για έτοιμα περιγράματα πινακα-->
< !--Αντι του box να βαλω void above below hsides lhs rhs vsides border-- >
height="500" < !-- Με την εντολή αυτή ορίζουμε το κάθετο ύψος του πίνακα.-->
cellpadding="10" < !-- Με την εντολή cellpadding="10" αφήνουμε απόσταση του περιεχομένου απο τις γραμμές των κελιών του πίνακα.-->
cellspacing="10" < !-- Με την εντολή cellspacing="10" αφήνουμε απόσταση μεταξύ των κελιών του πίνακα.-->
bgcolor="yellow" < !-- Με την εντολή bgcolor="yellow" αλλάζει το χρώμα του πίνακα.-->
align="left" < !-- Με την εντολή align="left" αλλάζει η θέση όλου του πίνακα μέσα στην ιστοσελίδα.-->
< !-- μπορεί να κεντραριστεί δεξια και στο κέντρο αντιστοιχα με align="right" και align="central" -->
background="/images/bird.jpg"
< --Με την εντολή background="bird.jpg" τοποθετούμε εικόνα στο φόντο του πίνακα -->
>
< !-- Οριζουμε επικεφαλίδα πάνω απο τον πίνακα -->
< caption>Eπικεφαλίδα του πίνακα< /caption>
< tr> < !-- Κάθε tag < tr> επαναλαμβάνεται η γραμμή του πίνακα. -->
< !-- Με κάθε tag < th> δινουμε τίτλο στη στήλη του πίνακα και φαίνεται πιο έντονα. -->
< th>Τίτλος στήλης 1 < /th>
< th>Τίτλος στήλης 2 < /th>
< th>Τίτλος στήλης 3 < /th>
< /tr>
< tr>
< td>γραμμή 1 στήλη 1< /td>
< td>γραμμή 1 στήλη 2< / td>
< td>γραμμή 1 στήλη 3< /td>
< /tr>
< tr>
< td>γραμμή 2 στήλη 1< /td>
< td>γραμμή 2 στήλη 2< /td>
< td>γραμμή 2 στήλη 3< /td>
< /tr>
< tr>
< td>January< /td>
< td>$100< /td>
< !-- Εάν δεν ορίσουμε στήλη 3 τότε δεν φαίνεται το κελί του πίνακα -->
< /tr>
< tr>
< td>γραμμή 4 στήλη 1........< /td>
< td>γραμμή 4 στήλη 2< /td>
< !-- Με την εντολή < td> < /td> φαίνεται το κελί του πίνακα αλλά άδειο.-->
< td> < /td>
< /tr>
< tr>
< td>γραμμή 5 στήλη 1< /td>
< !-- Με την εντολή colspan="2" κάνουμε ενοποίηση κελιών του πίνακα.-->
< td colspan="2">γραμμή 5 στήλη 2 και 3< /td>
< /tr>
< tr>
< !-- Με την εντολή colspan="2" κάνουμε ενοποίηση κελιών οριζόντια του πίνακα.-->
< td colspan="2">γραμμή 6 στήλη 1 και 2< /td>
< td>γραμμή 6 στήλη 3< /td>
< /tr>
< tr>
< !-- Με την εντολή colspan="3" κάνουμε ενοποίηση 3 κελιών οριζόντια του πίνακα.-->
< td colspan="3">γραμμή 7 στήλη 1 και 2 και 3< /td>
< /tr>
< tr>
< !-- Με την εντολή rowspan="2" κάνουμε ενοποίηση κελιών κάθετα του πίνακα.-->
< td rowspan="2">γραμμή 8 και 9 στήλη 1< /td>
< td>γραμμή 8 στήλη 2............< /td>
< td>γραμμή 8 στήλη 3< /td>
< /tr>
< tr>
< td>γραμμή 9 στήλη 2< /td>
< td>γραμμή 9 στήλη 3< /td>
< /tr>
< tr>
< !-- Με την εντολή bgcolor="purple" δίνουμε xρώμα στα κελιά του πίνακα.-->
< td bgcolor="purple">γραμμή 10 στήλη 1< /td>
< td>γραμμή 10 στήλη 2< /td>
< td bgcolor="red">γραμμή 10 στήλη 3< /td>
< /tr>
< tr>
< !-- Με την εντολή align="left" ευθυγραμίζουμε αριστερά το περιεχόμενο μέσα στο κελί του πίνακα.-->
< td align="left">γραμμή 11 στήλη 1< /td>
< td align="right">γραμμή 11 στήλη 2< /td>
< td>γραμμή 11 στήλη 3< /td>
< /tr>
< tr>
< !-- Με την εντολή align="central" κεντράρουμε το περιεχόμενο μέσα στο κελί του πίνακα.-->
< td align="central">γραμμή 12 στήλη 1< /td>
< td align="central">γραμμή 12 στήλη 2< /td>
< td>γραμμή 12 στήλη 3< /td>
< /tr>
< tr>
< !-- Με την εντολή background="bird.jpg" ενσωματώνουμε εικόνα στο φόντο του κελιού.-->
< td background="bird.jpg">γραμμή 13 στήλη 1< /td>
< td background="bird.jpg">γραμμή 13 στήλη 2< /td>
< td background="bird.jpg">γραμμή 13 στήλη 3< /td>
< /tr>
< /table>
< /body>
< /html>
< html>
