Pretvorba CSS jedinica je proces konvertiranja između različitih jedinica duljine (px, em, rem, %, vw, vh itd.) koje se koriste u web dizajnu.
Apsolutne i relativne jedinice
CSS jedinice se općenito dijele na apsolutne i relativne. Apsolutne jedinice (px, pt, cm itd.) imaju fiksne veličine, dok se relativne jedinice (em, rem, %, vw, vh itd.) izražavaju kao omjer prema osnovnoj vrijednosti.
px (Piksel)
Najčešća jedinica koja predstavlja jednu točku na zaslonu. Jednostavna za rukovanje zbog fiksne veličine, ali ima izazove u pristupačnosti jer ignorira korisničke postavke fonta.
em (Em)
Relativna jedinica temeljena na veličini fonta roditeljskog elementa. 1em = font-size roditelja. Računa se kumulativno u ugniježđenim strukturama što može dovesti do neočekivanih veličina.
rem (Root Em)
Relativna jedinica temeljena na veličini fonta root elementa (html). 1rem = font-size html elementa (obično 16px). Za razliku od em, nije pogođena ugniježđivanjem i preporučuje se u modernom CSS-u.
% (Postotak)
Predstavlja omjer prema roditeljskom elementu. Za font-size temelji se na font-size roditelja; za width na širini roditelja. Osnova ovisi o svojstvu.
vw/vh (Viewport jedinice)
Jedinice temeljene na veličini viewporta. 1vw = 1% širine viewporta, 1vh = 1% visine viewporta. Omogućuju fleksibilne rasporede koji se prilagođavaju veličini zaslona.
pt/pc (Jedinice za ispis)
Jedinice korištene u tiskarskoj industriji. 1pt = 1/72 inča, 1pc = 12pt. Koriste se u ispisnim stilovima i generiranju PDF-a, ali za zaslon se obično koriste px ili rem.
Fizičke jedinice (cm/mm/in)
Jedinice koje predstavljaju stvarnu fizičku duljinu. 1in = 2.54cm = 25.4mm = 96px (CSS definicija). Koriste se kada je potrebna usklađenost s tiskanom građom, ali fizička veličina zaslona nije zajamčena.
Prednosti konverzije u stvarnom vremenu
Ovaj alat podržava konverziju u stvarnom vremenu i odmah ažurira rezultate pri promjeni osnovnih vrijednosti. Omogućava brzo provjeravanje izgleda za različite veličine zaslona i postavke fonta.