Οι πίνακες HTML είναι εύκολο να δημιουργηθούν μόλις καταλάβετε τα βασικά στοιχεία των γραμμών και των στηλών και επίσης όταν καταλάβετε πότε είναι εντάξει να χρησιμοποιήσετε ένα τραπέζι και πότε πρέπει να τα αποφύγετε.
Μια σύντομη ιστορία των πινάκων και του σχεδιασμού ιστοσελίδων
Πριν από πολλά χρόνια, πριν από τα αποδεκτά πρότυπα CSS και web, οι σχεδιαστές ιστοσελίδων χρησιμοποίησαν το HTML
για να δημιουργήσετε μια διάταξη σελίδας για ιστότοπους. Τα σχέδια του ιστοτόπου θα "τεμαχιστούν" σε μικρά κομμάτια όπως ένα παζλ και στη συνέχεια θα συνδυαστούν με έναν πίνακα HTML για να εμφανιστούν στο πρόγραμμα περιήγησης όπως προβλέπεται. Ήταν μια πολύ περίπλοκη διαδικασία που δημιούργησε πολλά πρόσθετα σήματα HTML και τα οποία ποτέ δεν θα μπορούσαν να χρησιμοποιηθούν σήμερα στον κόσμο πολλαπλών οθονών που ζουν οι ιστοσελίδες μας. Καθώς το CSS έγινε η αποδεκτή μέθοδος για την οπτική παρουσίαση ιστοσελίδων και τη διάταξη, η χρήση πινάκων για αυτό έγινε αποφεύχθηκαν και πολλοί σχεδιαστές ιστοσελίδων πίστευαν λανθασμένα ότι "οι πίνακες ήταν κακοί." Αυτό ήταν και είναι αναληθές. Οι πίνακες για τη διάταξη είναι κακοί, αλλά εξακολουθούν να έχουν θέση στον σχεδιασμό ιστοσελίδων και στο HTML, δηλαδή στην εμφάνιση δεδομένων πίνακα όπως ένα ημερολόγιο ή ένα πρόγραμμα αμαξοστοιχίας. Για αυτό το περιεχόμενο, η χρήση ενός πίνακα παραμένει μια αποδεκτή και καλή προσέγγιση.
Έτσι πώς σχεδιάζετε ένα τραπέζι; Ας ξεκινήσουμε δημιουργώντας ένα απλό τραπέζι 2x2. Αυτό θα έχει 2 στήλες (αυτές είναι οι κάθετες μπλοκ) και 2 σειρές (τα οριζόντια μπλοκ). Αφού έχετε δημιουργήσει ένα τραπέζι 2x2, μπορείτε να δημιουργήσετε οποιοδήποτε πίνακα μεγέθους που θέλετε απλά προσθέτοντας επιπλέον σειρές ή στήλες.
Εδώ είναι πώς
-
Ανοίξτε πρώτα το τραπέζι
-
Ανοίξτε την πρώτη σειρά με την ετικέτα tr
-
Ανοίξτε την πρώτη στήλη με την ετικέτα td
|
-
Γράψτε τα περιεχόμενα του κελιού
-
Κλείστε το πρώτο κελί και ανοίξτε το δεύτερο
|
-
Γράψτε τα περιεχόμενα του δεύτερου κελιού
-
Κλείστε το δεύτερο κελί και κλείστε τη σειρά
-
Γράψτε τη δεύτερη σειρά ακριβώς όπως την πρώτη
| | |
-
Στη συνέχεια, κλείστε το τραπέζι
-
Αυτό είναι!
Μπορείτε επίσης να επιλέξετε να προσθέσετε κεφαλίδες στον πίνακα σας χρησιμοποιώντας το
στοιχείο. Αυτές οι κεφαλίδες τραπέζι θα αντικαταστήσει τα κομμάτια "δεδομένα πίνακα" στην πρώτη σειρά τραπέζι, όπως αυτό:
| Ονομα | Ρόλος | | Τζέρεμι | Σχεδιαστής | Τζένιφερ | Προγραμματιστής |
Όταν αυτή η σελίδα θα εμφανίζεται στο πρόγραμμα περιήγησης, αυτή η πρώτη γραμμή με τις κεφαλίδες του πίνακα θα εμφανίζεται από προεπιλογή με έντονη γραφή και θα επικεντρώνεται στο κελί του πίνακα στο οποίο εμφανίζονται.
Έτσι, είναι σωστό να χρησιμοποιείτε πίνακες σε HTML;
Ναι, εφ 'όσον δεν τις χρησιμοποιείτε για σκοπούς διαμόρφωσης, είναι εντάξει να χρησιμοποιείτε πίνακες. Εάν θέλετε να εμφανίσετε πληροφορίες πίνακα, ένας πίνακας είναι ο τρόπος για να το κάνετε αυτό. Στην πραγματικότητα, αποφεύγοντας ένα τραπέζι εξαιτίας κάποιας λανθασμένης καθαρότητας για να αποφύγετε αυτό το νόμιμο στοιχείο HTML είναι τόσο πίσω όσο και η χρήση τους για λόγους διαμόρφωσης σε αυτήν την ημέρα και ηλικία.
Γράφτηκε από την Jennifer Kyrin. Επεξεργασμένο από τον Jeremy Girard.
|
