Η letter-spacingιδιότητα ελέγχει την απόσταση μεταξύ κάθε γράμματος σε ένα δεδομένο στοιχείο ή τμήμα κειμένου. Οι τιμές που υποστηρίζονται letter-spacingπεριλαμβάνουν τιμές σχετικές με γραμματοσειρές (em, rem), γονικές-σχετικές τιμές (ποσοστό), απόλυτες τιμές (px) και την normalιδιότητα, η οποία επαναφέρεται στην προεπιλεγμένη γραμματοσειρά.
Συνιστάται η χρήση σχετικών τιμών γραμματοσειράς, έτσι ώστε να letter-spacingαυξάνεται ή να μειώνεται κατάλληλα όταν αλλάζει το μέγεθος της γραμματοσειράς, είτε από το σχεδιασμό είτε από τη συμπεριφορά του χρήστη.
p ( /* 16 * 0.0625 = 1px */ letter-spacing: 0.0625em; )Το πιο σημαντικό σημείο που πρέπει να σημειωθεί κατά τη χρήση letter-spacingείναι ότι η καθορισμένη τιμή δεν αλλάζει την προεπιλογή, προστίθεται στην προεπιλεγμένη απόσταση που εφαρμόζεται το πρόγραμμα περιήγησης (βάσει των μετρήσεων γραμματοσειρών). letter-spacingυποστηρίζει επίσης αρνητικές τιμές, οι οποίες θα συσφίγγουν την εμφάνιση του κειμένου, αντί να το χαλαρώνουν.
Σημεία ενδιαφέροντος
- Τιμές subpixel: στα περισσότερα προγράμματα περιήγησης, ορίζοντας μια τιμή που υπολογίζεται σε μικρότερη από αυτήν δεν
1pxθα έχει ως αποτέλεσμα να μηνletter-spacingεφαρμόζεται. Προς το παρόν, το Firefox 14+ και το IE 10 υποστηρίζουν διάταξη subpixel. Το Opera και το WebKit δεν το κάνουν. Το έμπλαστρο έχει προσγειωθεί, οπότε το WebKit υποστηρίζει τώρα το διάκενο με γράμματα subpixel. - Η
letter-spacingιδιότητα είναι κινούμενη με μεταβάσεις CSS. - Ένας από τους τρόπους για την καταπολέμηση του διαστήματος μεταξύ των ενσωματωμένων στοιχείων μπλοκ είναι η ρύθμιση
letter-spacing: -4px;στο γονικό κοντέινερ στοιχείων ενσωματωμένου μπλοκ. Στη συνέχεια, θα πρέπει να επαναφέρετεletter-spacing: normal;τα θυγατρικά στοιχεία. - Είναι σπάνια καλή ιδέα να γράφετε γράμματα με πεζά γράμματα.
Υποστήριξη προγράμματος περιήγησης
| Χρώμιο | Σαφάρι | Firefox | ΛΥΡΙΚΗ ΣΚΗΝΗ | ΙΕ | Android | iOS |
|---|---|---|---|---|---|---|
| Εργα | Εργα | Εργα | Πλέον | Εργα | Εργα | Εργα |
Μια σημείωση σχετικά με την υποστήριξη του προγράμματος περιήγησης για κινητά: ορισμένες εκδόσεις Opera Mobile, μη τυπικές εφαρμογές WebKit και το πρόγραμμα περιήγησης NetFront δεν υποστηρίζουν letter-spacing. Οι λεπτομέρειες περιγράφονται λεπτομερώς στον παραπάνω σύνδεσμο QuirksMode.