Πίνακες στην HTML
Οι πίνακες στην HTML χρησιμοποιούνται για να εμφανίσουμε στοιχεία (κείμενα, φωτογραφίες κ.α.) ζυγισμένα και στοιχισμένα μέσα σε γραμμές και στήλες.
Για να ορίσουμε έναν πίνακα χρησιμοποιούμε την ετικέτα <table> και για να ορίσουμε το τέλος του πίνακα, την ετικέτα </table>. Οι ετικέτες <tr> και </tr> ορίζουν μία γραμμή ενός πίνακα και οι ετικέτες <td> και </td> ορίζουν μία στήλη του πίνακα.
Πίνακες στην HTML – Παράδειγμα 1
<table>
<tr>
<td> Γραμμή 1 - Στήλη 1 </td>
<td> Γραμμή 1 - Στήλη 2 </td>
</tr>
<tr>
<td> Γραμμή 2 - Στήλη 1 </td>
<td> Γραμμή 2 - Στήλη 2 </td>
</tr>
</table>Μπορούμε να βάλουμε επικεφαλίδες στον πίνακα χρησιμοποιώντας τις ετικέτες <th> και </th>.
Πίνακες στην HTML – Παράδειγμα 2
<table>
<tr>
<th> Επικεφαλίδα 1 </th>
<th> Επικεφαλίδα 2 </th>
</tr>
<tr>
<td> Γραμμή 1 - Στήλη 1 </td>
<td> Γραμμή 1 - Στήλη 2 </td>
</tr>
<tr>
<td> Γραμμή 2 - Στήλη 1 </td>
<td> Γραμμή 2 - Στήλη 2 </td>
</tr>
</table>Επίσης μπορούμε να βάλουμε τίτλο στον πίνακα χρησιμοποιώντας τις ετικέτες <caption> και </caption>.
Πίνακες στην HTML – Παράδειγμα 3
<table>
<caption> Τίτλος </caption>
<tr>
<th> Επικεφαλίδα 1 </th>
<th> Επικεφαλίδα 2 </th>
</tr>
<tr>
<td> Γραμμή 1 - Στήλη 1 </td>
<td> Γραμμή 1 - Στήλη 2 </td>
</tr>
<tr>
<td> Γραμμή 2 - Στήλη 1 </td>
<td> Γραμμή 2 - Στήλη 2 </td>
</tr>
</table>Για να βάλουμε περίγραμμα στον πίνακα χρησιμοποιούμε την εντολή border= και ένα ακέραιο αριθμό στην ετικέτα του πίνακα <table>. Ανάλογα με τον αριθμό που θα βάλουμε θα ορίσουμε και το πάχος του πίνακα.
Πίνακες στην HTML – Παράδειγμα 3
<table border="2">
<tr>
<td> Γραμμή 1 - Στήλη 1 </td>
<td> Γραμμή 1 - Στήλη 2 </td>
</tr>
<tr>
<td> Γραμμή 2 - Στήλη 1 </td>
<td> Γραμμή 2 - Στήλη 2 </td>
</tr>
</table>