Πώς να αλλάξετε το χρώμα φόντου ενός πίνακα

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

Πώς να αρχίσω

Η ιδιότητα bgcolor θα αλλάξει το χρώμα φόντου του πίνακα καθώς και την τρέχουσα σειρά πίνακα ή την τρέχουσα κυψέλη πίνακα. Αλλά το χαρακτηριστικό bgcolor είναι υπερβολικό υπέρ των φύλλων στυλ, έτσι δεν είναι ο βέλτιστος τρόπος για να αλλάξετε το χρώμα του φόντου του πίνακα. Ο καλύτερος τρόπος για να αλλάξετε το χρώμα φόντου είναι να προσθέσετε το χρώμα φόντου της ιδιότητας στυλ στον πίνακα, την ετικέτα γραμμής ή κελιών. Δείτε το παρακάτω παράδειγμα για να μάθετε πώς.

Αν για κάποιο λόγο δεν θέλετε να προσθέσετε στο τραπέζι το χρώμα φόντου της ιδιότητας στυλ, υπάρχουν εναλλακτικές λύσεις από τις οποίες μπορείτε να επιλέξετε. Για παράδειγμα, μπορείτε να ορίσετε τα στυλ σε ένα φύλλο στυλ στην κεφαλή του εγγράφου σας ή σε ένα εξωτερικό φύλλο στυλ . Δείτε τα εξής:

πίνακας {χρώμα-φόντου: # ff0000; } tr {φόντο-χρώμα: κίτρινο; } td {φόντο-χρώμα: # 000; }}

Ρύθμιση του χρώματος φόντου

Ο καλύτερος τρόπος για να ορίσετε το χρώμα φόντου σε μια στήλη είναι να δημιουργήσετε μια κλάση στυλ και στη συνέχεια να αντιστοιχίσετε αυτήν την κλάση στα κελιά αυτής της στήλης. Δείτε τα παρακάτω παραδείγματα για να μάθετε πώς να το κάνετε αυτό.

Το CSS:

td.blueCol {φόντο-χρώμα: μπλε; }}

Το HTML:

class = "blueCol" > κελί 1 κελί 1 κελί 2

Τυλίγοντας

Ακόμη και αν δεν έχετε αλλάξει ποτέ τα χρώματα φόντου ενός πίνακα, μπορείτε να αντιγράψετε τα παραδείγματα παραπάνω για να δοκιμάσετε αυτή τη μέθοδο μόνοι σας. Δοκιμάστε τις διάφορες επιλογές που παρουσιάζονται και επιλέξτε εκείνη με την οποία τελικά αισθάνεστε πιο άνετα. Και αν θέλετε περισσότερες πληροφορίες σχετικά με τους πίνακες HTML, συμβουλευτείτε αυτή τη Συχνή Συχνότητα για περισσότερες λεπτομέρειες.