เครื่องแปลง PX เป็น REM

วิธีการทำงาน

หนึ่ง rem เท่ากับขนาดตัวอักษรขององค์ประกอบ html ราก ซึ่งในเบราว์เซอร์ค่าเริ่มต้นคือ 16 px การหารค่าพิกเซลด้วยขนาดราคจะได้ rem และการคูณ rem ด้วยขนาดรากจะได้พิกเซล

หน่วย em ทำงานคล้ายกัน แต่สัมพันธ์กับขนาดตัวอักษรขององค์ประกอบแม่ ดังนั้นจะเท่ากับ rem ก็ต่อเมื่อองค์ประกอบแม่ใช้ขนาดราก

ใน CSS กำหนด 1 px เท่ากับ 1/96 นิ้ว และ 1 pt เท่ากับ 1/72 นิ้ว ดังนั้น 1 px = 0.75 pt

สูตร

rem = px ÷ ขนาดราก
px = rem × ขนาดราก
pt = px × 0.75

ตัวอย่างการคำนวณ

เมื่อขนาดรากเริ่มต้น 16 px ค่า 24 px คือ 24 ÷ 16 = 1.5 rem ซึ่งเท่ากับ 18 pt และ 150% ของขนาดราก