Η ιδιότητα text-align του CSS

Ορισμός και χρήση

Η ιδιότητα text-align καθορίζει τον τρόπο με τον οποίο το κείμενο ενός στοιχείου είναι水平和ιδιοτητας.

Η ιδιότητα αυτή ρυθμίζει τον τρόπο με τον οποίο το κείμενο ενός στοιχείου块的水平和ιδιοτητας μέσα στο κείμενο, μέσω της καθορισμού ποιος σημείο του γραμμικού πλαισίου συναντάται με το κείμενο. Με την επιτύχια του χρήστη να προσαρμόσει τον χώρο μεταξύ των γραμμάτων και των λέξεων, υποστηρίζεται η τιμή justify; διαφορετικοί χρήστες μπορεί να αποκτήσουν διαφορετικά αποτελέσματα.

Δείτε επίσης:

Εκμάθηση CSS:CSS Γραφή

Εγχειρίδιο HTML DOM:ιδιότητα textAlign

παράδειγμα

Ρύθμιση της προσαρμογής κειμένου των στοιχείων h1, h2, h3:

h1 {text-align:center;}
h2 {text-align:left;}
h3 {text-align:right;}

δοκιμάστε το προσωπικά

γλώσσα CSS

text-align: left|right|center|justify|initial|inherit;

τιμή ιδιοτητας

τιμή περιγραφή
left το κείμενο θα τοποθετηθεί αριστερά. Προεπιλεγμένη τιμή: από τον περιηγητή.
right Τακτοποίηση του κειμένου στο δεξί.
center Τακτοποίηση του κειμένου στο κέντρο.
justify Επιτρέπει την επίτευξη του αποτελέσματος του κειμένου με δύο πλάγια στήθος.
inherit Καθορίζεται ότι η τιμή της ιδιότητας text-align θα αποκτηθεί από το γονικό στοιχείο.

Η τιμή justify

Ο τελευταίος παράγοντας ισορροπίας είναι o justify, ο οποίος φέρνει τα δικά του προβλήματα.

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

Πρέπει να καθοριστεί από τον χρήστη του προγράμματος περιήγησης (και όχι από τη CSS) πώς θα επεκταθεί το κείμενο με δύο πλάγια στήθος για να γεμίσει τον χώρο μεταξύ των δεξιών και αριστερών ορίων του γονικού στοιχείου. Για παράδειγμα, μερικές περιηγητές μπορεί να προσθέσουν επιπλέον χώρο μεταξύ των λέξεων, ενώ άλλοι περιηγητές μπορεί να μοιράσουν το επιπλέον χώρο μεταξύ των γραμμάτων (αλλά η κανονιστική προδιαγραφή επισημαίνει ότι αν Ιδιότητα letter-spacingΚαθορίζεται ως τιμή μήκους ("Ο χρήστης του προγράμματος περιήγησης δεν μπορεί να αυξήσει ή να μειώσει περαιτέρω το διάστημα μεταξύ των χαρακτήρων"). Εξάλλου, μερικοί χρήστες του προγράμματος περιήγησης μπορεί να μειώσουν τον χώρο σε ορισμένες γραμμές, ώστε το κείμενο να γίνεται πιο στενό. Όλα αυτά επηρεάζουν την εμφάνιση του στοιχείου, ακόμη και το ύψος του, ανάλογα με πόσα κείμενα επηρεάζει η επιλογή του χρήστη του προγράμματος περιήγησης.

Η CSS δεν καθορίζει πώς να χειριστεί τον διάλειμμα (σημείωση 1). Οι περισσότερες κείμενα με δύο πλάγια στήθος χρησιμοποιούν τον διάλειμμα για να μοιράζουν μακρύτερα λέματα σε δύο γραμμές, μειώνοντας τον διαστήματα μεταξύ των λέξεων και βελτιώνοντας την εμφάνιση της γραμμής κειμένου. Ωστόσο, λόγω της ανυπόστατης κανονιστικής περιγραφής του διαλείμματος, ο χρήστης του προγράμματος περιήγησης είναι λιγότερο πιθανό να το προσθέσει αυτόματα. Επομένως, τα κείμενα με δύο πλάγια στήθος στο CSS φαίνονται λιγότερο καλά τυπωμένα, ειδικά όταν οι στοιχεία είναι πολύ στενά, ώστε να μπορούν να τοποθετηθούν μόνο μερικές λέξεις ανά γραμμή. Φυσικά, η χρήση στενών σχεδιαστικών στοιχείων είναι δυνατή, αλλά πρέπει να προσέξετε τις αντίστοιχες ανεπιθύμητες συνέπειες.

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

Τεχνικές λεπτομέρειες

Προεπιλεγμένη τιμή: Αν η ιδιότητα direction είναι ltr, η προεπιλεγμένη τιμή είναι left; αν η direction είναι rtl, τότε είναι right.
Επιδίωξη: ναι
Έκδοση: CSS1
Γλώσσα γραμματογραφίας JavaScript: objekt.style.textAlign="aristeron"

Περισσότερα παραδείγματα

Ισορροπία των κειμένων
Αυτό το παράδειγμα δείχνει πώς να ισορροπούνται τα κείμενα.

Υποστήριξη του προγράμματος περιήγησης

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

Chrome IE / Edge Firefox Safari Opera
1.0 3.0 1.0 1.0 3.5