Πώς να κεντράρετε κείμενο σε μια κελιά πίνακα

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

Ξεκινώντας

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

Επιπλέον, θα πρέπει να δημιουργήσετε ένα εσωτερικό φύλλο στυλ στην κεφαλή του εγγράφου σας ή να το επισυνάψετε ως εξωτερικό φύλλο στυλ . Θα τοποθετήσετε τα στυλ στο κέντρο των κελιών του πίνακα σας σε αυτό το φύλλο στυλ.

Πώς να κεντράρετε κάθε κελιά στον πίνακα

Προσθέστε τις ακόλουθες γραμμές στο φύλλο στυλ σας:

td, th {κείμενο-ευθυγράμμιση: κέντρο; }}

Πώς να κεντράρετε κάθε κελιά κεφαλίδας στον πίνακα

Προσθέστε τις ακόλουθες γραμμές στο φύλλο στυλ σας:

th {κείμενο-ευθυγράμμιση: κέντρο; }}

Κέντρωση κάθε κελιού στην κεφαλίδα, το σώμα ή τα πόδια

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

theadth, thead td {κείμενο-ευθυγράμμιση: κέντρο; } tbody th, tbody td {κείμενο-ευθυγράμμιση: κέντρο; } tfoot th, tfoot td {κείμενο-ευθυγράμμιση: κέντρο; }}

Αφαιρέστε τα στυλ για τις περιοχές που δεν θέλετε να επικεντρωθούν.

Πώς να κεντράρετε ένα συγκεκριμένο στοιχείο ή κελιά σε έναν πίνακα

Για να γίνει αυτό, θα πρέπει να ορίσετε μια τάξη στα κελιά που θέλετε να επικεντρωθούν.

Προσθέστε το ακόλουθο χαρακτηριστικό στα κελιά πίνακα που θέλετε να επικεντρωθούν:

class = "centered-cell" >

Στη συνέχεια, προσθέστε τα παρακάτω στο φύλλο στυλ:

.centered-cell {κείμενο-ευθυγράμμιση: κέντρο; }}

Μπορείτε να προσθέσετε αυτήν την τάξη σε οποιοδήποτε κελί στον πίνακα σας.

Τυλίγοντας

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