Ο καλύτερος τρόπος για να κεντράρετε το κείμενο σε ένα κελί πίνακα

click fraud protection

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

Ξεκινώντας

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

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

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

instagram viewer

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

td, ου {
text-align: center;
}

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

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

ο {
text-align: center;
}

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

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

Thead th, Thead td {
text-align: center;
}
tbody th, tbody td {
text-align: center;
}
tfoot th, tfoot td {
text-align: center;
}

Καταργήστε τα στυλ για τις περιοχές που δεν θέλετε να κεντράρετε.

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

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

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

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

.center-cell {
text-align: center;
}

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

Τυλίγοντας

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

instagram story viewer