px átváltása rem‑re: px, rem, pt, em, mm
Utoljára frissítve:
A rem ehhez a mérethez igazodik, és itt az em és a % is. CSS-ben viszont ez a kettő a szülőelemet követi, ezért csak ott egyezik meg a rem-mel, ahol egyetlen szülőelem sem módosítja a betűméretet.
1 px = 0,0625 remÖsszes eredmény
Gyorstáblázat: Pixel → Root em
| Érték (px) | Eredmény (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 |
A px, a rem és a pt mértékegységekről
A CSS az 1 hüvelyket 96 px-ben rögzíti, így 1 pt, vagyis 1/72 hüvelyk, 1,333 px-nek felel meg, 1 mm pedig 3,78 px-nek. A rem és az em relatív mértékegység: 1 rem a gyökérelem betűmérete, minden elterjedt böngészőben 16 px, hacsak a látogató nem módosítja, így 24 px 1,5 rem. Ha a stíluslap más gyökérméretet állít be, adja meg alapként a mezők felett. Az em a szülőelem betűméretét követi, ezért csak ott egyezik meg a rem-mel, ahol egyetlen szülőelem sem módosítja.
Gyakori szöveg- és elemméretek
Az alapértelmezett 16 px-es alapnál. A CSS az 1 hüvelyket 96 px-ben rögzíti, ezért a pt és mm oszlop bármilyen alapnál érvényes; csak a rem oszlop változik vele.
| Méret | rem | pt | mm |
|---|---|---|---|
| 10 pt-os szöveg (lábjegyzet) | 0,8333 | 10 | 3,528 |
| A böngésző alapértelmezett szövegmérete | 1 | 12 | 4,233 |
| 12 pt-os szöveg szövegszerkesztőben | 1 | 12 | 4,233 |
| Alapértelmezett h2 címsor | 1,5 | 18 | 6,35 |
| A legkisebb célméret a WCAG 2.2-ben (2.5.8) | 1,5 | 18 | 6,35 |
| Alapértelmezett h1 címsor | 2 | 24 | 8,467 |
| 1 centiméter | 2,362 | 28,35 | 10 |
| 1 hüvelyk | 6 | 72 | 25,4 |
A pont és a pixel története
A betűket pontban mérték jóval a képernyők előtt: a betűöntőknek egyetlen egységre volt szükségük ahhoz, hogy az öntött betűk sorba illeszkedjenek. A számítógépek az 1/72 hüvelykben rögzítették a pontot.
- Pierre-Simon Fournier közzétett egy betűméret-táblázatot tipográfiai pontokban mérve: skálája a hüvelyket 12 vonalra, minden vonalat 6 pontra osztotta.
- Az Egyesült Államok betűöntőinek szövetsége pontrendszert fogadott el a betűtestekhez, amelyben a nonpareille 6 pont, a pica pedig 12.
- Az Adobe bemutatta a PostScriptet, amely az oldalon az 1/72 hüvelyket használja hosszegységként: az Adobe szavaival ez nagyjából ugyanannyi, mint a nyomdai pont.
- A CSS 2.1 W3C-ajánlás lett. Az 1 hüvelyket 96 px-ben és 72 pt-ben rögzíti, így 1 px 0,75 pt, a pixelt pedig egy 96 dpi-s képernyő egy pontjához köti, karnyújtásnyi távolságból nézve.
Források: