Internet
Now Reading
8ο Μάθημα HTML-Πίνακες
0

8ο Μάθημα HTML-Πίνακες

by Ελένη Χαλικιά15 November, 2012

Περιγραφή Μαθήματος
Στο σημερινό μας μάθημα θα δείτε τις ετικέτες για δημιουργία πινάκων, τη σημασιολογική τους έννοια, το πως μπορείτε να τις χρησιμοποιήσετε και μερικά παραδείγματα για να τις κατανοήσετε.

Εισαγωγή στις ετικέτες
Οι ετικέτες αυτές είναι για δημιουργία ενός πίνακα, είτε για να δημιουργήσετε τις στήλες του πίνακα ή είτε για να ορίσετε τα δεδομένα κάθε στήλης του πίνακα σας.

Σημασιολογία ετικετών
<table border=”9″>: Αυτό χρησιμεύει για να δηλώσετε τον πίνακα αλλά και για να διαμορφώσετε το  πάχος του πίνακα σας
<tr> </tr>: Αυτό χρησιμεύει για να ορίσετε μια σειρά σ’έναν πίνακα
<td> </td>: Αυτό χρησιμεύει για να ορίσετε ένα κελί σ’έναν πίνακα
<th> </th>: Αυτό χρησιμεύει για να καθορίσετε  ένα κελί μιας επικεφαλίδας μέσα σ’έναν πίνακα
</table>: Αυτό χρησιμεύει για να δηλώσετε την ολοκλήρωση του πίνακα, δηλαδή το κλείσιμο του

Παράδειγμα Απλού Πίνακα

Αυτό είναι ένα μικρό παράδειγμα για να δείτε την δημιουργία ενός απλού πίνακα.

Κώδικας Παραδείγματος:

<!DOCTYPE html>
<body>
<table border=”9″>
<tr>
<td>Ηθοποιός</td>
<td>Σειρά</td>
</tr>
<tr>
<td>Γιάννης Τσιμιτσέλης</td>
<td>Πολυκατοικία</td>
</tr>
</table>
</body>
</html>

Tips
Το border έχει να κάνει με το πάχος πλαισίου του πίνακα και όσο ποιο παχύ πλαίσιο θέλετε να έχει ο πίνακας σας τόσο ποιο μεγάλο αριθμό θα βάζετε στο border.
 

Παράδειγμα Πίνακα με δύο στήλες
Αυτό είναι ένα μικρό παράδειγμα για να δείτε την δημιουργία ενός πίνακα με δύο στήλες και ποιο συγκεκριμένα δείτε την παρακάτω εικόνα.
Κώδικας Παραδείγματος:

<!DOCTYPE html>
<html>
<body>
<table border=”5″>
<tr>
<th>Προϊόντα</th>
<th>Κόστος</th>
</tr>
<tr>
<td>Αυτοκίνητο</td>
<td>10.000</td>
</tr>
<tr>
<td>Μηχανή</td>
<td>3.000</td>
</tr>
</table>
</body>
</html>

Tips
Για να δημιουργήσετε έναν πίνακα με περισσότερες στήλες και περισσότερα δεδομένα απλά χρησιμοποιήστε περισσότερες ετικέτες ανάλογα με το τι πίνακα θέλετε να δημιουργήσετε.
Επίλογος
Στο επόμενο μάθημα μας για την HTML θα δείτε τις ετικέτες για το πως να βάζετε συνδέσμους σε μια ιστοσελίδα και ποιο συγκεκριμένα τα εξής:
  • Σημασιολογία των ετικετών
  • Χρήση των ετικετών
  • Παραδείγματα ετικετών 

Κατέβασμα Μαθήματος
Κατεβάστε το όγδοο μας μάθημα HTML στον υπολογιστή σας εντελώς δωρεάν σε μορφή pdf.
Download

Συντάκτης
Ελένη Χαλικιά
Τεχνικός Τεχνολογίας Internet
Τεχνικός Εφαρμογών Πληροφορικής

Comments

comments