Μετατροπή px σε rem: px, rem, pt, em, mm
Τελευταία ενημέρωση:
Το rem μετριέται σε σχέση με αυτό το μέγεθος. Το ίδιο ισχύει εδώ για τα em και %. Στην CSS ακολουθούν το γονικό στοιχείο, οπότε ισοδυναμούν με το rem μόνο όταν κανένα γονικό στοιχείο δεν αλλάζει το μέγεθος γραμματοσειράς.
1 px = 0,0625 remΌλα τα αποτελέσματα
Πίνακας γρήγορης αναφοράς: Εικονοστοιχείο (pixel) → rem (root em)
| Τιμή (px) | Αποτέλεσμα (rem) |
|---|---|
| 1 px | 0,0625 rem |
| 8 px | 0,5 rem |
| 10 px | 0,625 rem |
| 12 px | 0,75 rem |
| 14 px | 0,875 rem |
| 16 px | 1 rem |
| 18 px | 1,125 rem |
| 20 px | 1,25 rem |
| 24 px | 1,5 rem |
| 32 px | 2 rem |
| 48 px | 3 rem |
| 64 px | 4 rem |
Σχετικά με τα px, rem και pt
Η CSS ορίζει 1 ίντσα ίση με 96 px, άρα 1 pt, που είναι 1/72 της ίντσας, αντιστοιχεί σε 1,333 px και 1 mm αντιστοιχεί σε 3,78 px. Τα rem και em είναι σχετικά: 1 rem είναι το μέγεθος γραμματοσειράς της ρίζας, 16 px σε όλα τα μεγάλα προγράμματα περιήγησης εκτός αν ο επισκέπτης το αλλάξει, οπότε τα 24 px είναι 1,5 rem. Αν ένα φύλλο στυλ ορίζει άλλο μέγεθος ρίζας, γράψτε το ως βάση πάνω από τα πεδία. Το em ακολουθεί το μέγεθος γραμματοσειράς του γονικού στοιχείου, οπότε ισούται με το rem μόνο όταν κανένα γονικό στοιχείο δεν το αλλάζει.
Συνηθισμένα μεγέθη κειμένου και στοιχείων
Με την προεπιλεγμένη βάση των 16 px. Η CSS ορίζει 1 ίντσα ίση με 96 px, οπότε οι στήλες pt και mm ισχύουν για οποιαδήποτε βάση, ενώ μόνο η στήλη rem αλλάζει μαζί της.
| Μέγεθος | rem | pt | mm |
|---|---|---|---|
| Κείμενο 10 pt (υποσημειώσεις) | 0,8333 | 10 | 3,528 |
| Προεπιλεγμένο μέγεθος κειμένου του προγράμματος περιήγησης | 1 | 12 | 4,233 |
| Κείμενο 12 pt σε επεξεργαστή κειμένου | 1 | 12 | 4,233 |
| Προεπιλεγμένος τίτλος h2 | 1,5 | 18 | 6,35 |
| Ελάχιστο μέγεθος στόχου στο WCAG 2.2 (2.5.8) | 1,5 | 18 | 6,35 |
| Προεπιλεγμένος τίτλος h1 | 2 | 24 | 8,467 |
| 1 εκατοστό | 2,362 | 28,35 | 10 |
| 1 ίντσα | 6 | 72 | 25,4 |
Ιστορία της τυπογραφικής στιγμής και του pixel
Τα στοιχεία τυπογραφίας μετριούνταν σε στιγμές πολύ πριν από τις οθόνες: τα χυτήρια τυπογραφικών στοιχείων χρειάζονταν μία μονάδα για να χυτεύουν γράμματα που ευθυγραμμίζονται. Οι υπολογιστές όρισαν τη στιγμή στο 1/72 της ίντσας.
- Ο Pierre-Simon Fournier δημοσίευσε έναν πίνακα μεγεθών στοιχείων τυπογραφίας μετρημένων σε τυπογραφικές στιγμές: η κλίμακά του χώριζε την ίντσα σε 12 γραμμές και κάθε γραμμή σε 6 στιγμές.
- Η Ένωση Χυτηρίων Τυπογραφικών Στοιχείων των Ηνωμένων Πολιτειών (Type Founders' Association of the United States) υιοθέτησε ένα σύστημα στιγμών για τα σώματα των στοιχείων, στο οποίο η nonpareil είναι 6 στιγμές και η pica 12.
- Η Adobe παρουσίασε την PostScript, της οποίας η μονάδα μήκους στη σελίδα είναι 1/72 της ίντσας: κατά τα λόγια της Adobe, περίπου ίδια με τη στιγμή που χρησιμοποιείται στην εκτύπωση.
- Η CSS 2.1 έγινε Σύσταση του W3C. Ορίζει 1 ίντσα ίση με 96 px και 72 pt, άρα 1 px είναι 0,75 pt, και βασίζει το εικονοστοιχείο σε μία κουκκίδα οθόνης 96 dpi όπως φαίνεται από απόσταση τεντωμένου χεριού.
Πηγές: