Przelicznik px na rem: px, rem, pt, em, mm
Ostatnia aktualizacja:
rem liczy się względem tego rozmiaru. Tutaj em i % także, choć w CSS zależą od elementu nadrzędnego, więc zgadzają się z rem tylko tam, gdzie żaden element nadrzędny nie zmienia rozmiaru czcionki.
1 px = 0,0625 remWszystkie wyniki
Tabela szybkich przeliczeń: Piksel → Root em
| Wartość (px) | Wynik (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 |
O px, rem i pt
CSS ustala 1 cal na 96 px, więc 1 pt, czyli 1/72 cala, to 1,333 px, a 1 mm to 3,78 px. rem i em są jednostkami względnymi: 1 rem to rozmiar czcionki elementu głównego, w każdej popularnej przeglądarce 16 px, o ile użytkownik go nie zmieni, więc 24 px to 1,5 rem. Jeśli arkusz stylów ustawia inny rozmiar główny, wpisz go jako bazę nad polami. em zależy od rozmiaru czcionki elementu nadrzędnego, więc równa się rem tylko tam, gdzie żaden element nadrzędny go nie zmienia.
Typowe rozmiary tekstu i elementów
Przy domyślnej bazie 16 px. CSS ustala 1 cal na 96 px, więc kolumny pt i mm są takie same przy każdej bazie; zmienia się tylko kolumna rem.
| Rozmiar | rem | pt | mm |
|---|---|---|---|
| Tekst 10 pt (przypisy dolne) | 0,8333 | 10 | 3,528 |
| Domyślny rozmiar tekstu w przeglądarce | 1 | 12 | 4,233 |
| Tekst 12 pt w edytorze tekstu | 1 | 12 | 4,233 |
| Domyślny nagłówek h2 | 1,5 | 18 | 6,35 |
| Najmniejszy obszar kliknięcia według WCAG 2.2 (2.5.8) | 1,5 | 18 | 6,35 |
| Domyślny nagłówek h1 | 2 | 24 | 8,467 |
| 1 centymetr | 2,362 | 28,35 | 10 |
| 1 cal | 6 | 72 | 25,4 |
Historia punktu i piksela
Pismo mierzono w punktach na długo przed ekranami: odlewnicy czcionek potrzebowali jednej jednostki, by odlewać litery pasujące do siebie w wierszu. Komputery ustaliły punkt na 1/72 cala.
- Pierre-Simon Fournier opublikował tabelę wielkości pisma mierzonych w punktach typograficznych: jej skala dzieliła cal na 12 linii, a każdą linię na 6 punktów.
- Stowarzyszenie Odlewników Czcionek Stanów Zjednoczonych przyjęło system punktowy dla kegli pisma, w którym nonparel to 6 punktów, a pica 12.
- Firma Adobe wprowadziła PostScript, w którym jednostką długości na stronie jest 1/72 cala: według Adobe mniej więcej tyle, ile punkt używany w druku.
- CSS 2.1 został rekomendacją W3C. Ustala 1 cal na 96 px i 72 pt, więc 1 px to 0,75 pt, a piksel wiąże z jednym punktem ekranu 96 dpi oglądanego z odległości wyciągniętej ręki.
Źródła: