PX ↔ REM Converter

CSS piksellarini rem ga va teskarisiga aylantiring. Asos o'lchamni o'zgartirsangiz, jadval ham darhol qayta hisoblanadi.

—

Tez jadval

pxrempxrem

px va rem — farqi nimada

px — qat'iy o'lcham: 24px doim 24 piksel bo'ladi.rem esa nisbiy: u sahifaning ildiz elementi (<html>) font o'lchamiga bog'langan. Brauzerlarda bu odatda 16px, shuning uchun1rem = 16px, 1.5rem = 24px.

Nega rem ishlatish kerak

Asosiy sabab — foydalanuvchi sozlamasi. Ko'zi xiraroq odam brauzer sozlamasida shrift o'lchamini kattalashtiradi (masalan 16px o'rniga 20px). Agar siz px yozgan bo'lsangiz, sayt bu sozlamani e'tiborsiz qoldiradi — matn kichikligicha qolaveradi. rem yozsangiz, butun sayt mutanosib ravishda kattalashadi.

Ikkinchi foyda — bitta joydan boshqarish: html ning font o'lchamini o'zgartirsangiz, rem da yozilgan barcha o'lchamlar birdaniga qayta hisoblanadi.

rem va em

  • rem — doim ildiz elementga nisbatan. Qayerda yozilishidan qat'i nazar bir xil natija beradi.
  • em — o'z elementining font o'lchamiga nisbatan. Ichma-ich joylashganda ko'payib ketadi: ota element1.2em, bolasi ham 1.2em bo'lsa, natija1.44em bo'ladi. Shuning uchun umumiy o'lchamlar uchunrem, element ichidagi nisbatlar uchun (masalan tugma ichidagi bo'shliq) em qulay.

Qayerda px qoldirish ma'qul

Hamma narsani rem qilish shart emas. Chegara chizig'i (border: 1px), soya va juda mayda tafsilotlarpx da qolgani yaxshi — ular shrift o'lchamiga bog'liq emas va rem ga o'tkazilsa kasr piksel chiqib, chiziq xiralashadi.

"62.5% hiylasi" nima

Ba'zi loyihalarda html { font-size: 62.5%; }yoziladi — bu 16px ni 10px ga tushiradi, natijada hisob osonlashadi:1.6rem = 16px, 2.4rem = 24px. Yuqoridagi "Asos" maydoniga 10 yozib, shu tartibdagi jadvalni ko'rishingiz mumkin. Kamchiligi — rem qiymatlari o'qishga noqulay bo'lib qoladi va boshqa kutubxonalar bilan aralashganda chalkashlik tug'diradi.

Barcha hisob-kitob brauzeringizda bajariladi — kiritgan ma'lumotingiz serverga yuborilmaydi.