เครื่องมือแปลงหน่วย px เป็น rem และ em

เครื่องมือนี้ทำอะไรได้บ้าง

เครื่องมือนี้แปลงค่าพิกเซล (px) เป็น rem และ em และแปลงกลับได้เช่นกัน กรอกค่าในหน่วยใดหน่วยหนึ่ง อีกสองหน่วยจะคำนวณให้ทันที คุณยังตั้งขนาดตัวอักษรรูทและขนาดตัวอักษรบริบท em เองได้ เพื่อให้ผลลัพธ์ตรงกับงานออกแบบของคุณ

อินพุตและผลลัพธ์

มีสามช่องให้กรอก ได้แก่ "ขนาดตัวอักษรรูท (px)" เป็นฐานคำนวณ rem, "ขนาดตัวอักษรบริบท em (px)" เป็นขนาดตัวอักษรขององค์ประกอบที่ใช้คำนวณ em และช่อง "ค่า" สำหรับความยาวที่จะแปลง แก้ไขช่องใดช่องหนึ่ง อีกสองช่องอัปเดตตามทันทีขณะพิมพ์ ด้านล่างมีตาราง "การแปลง px → rem ทั่วไป (ฐาน 16px)" ให้ดูค่าที่ใช้บ่อยได้ทันที

rem และ em อ้างอิงกับอะไร

rem คำนวณจากขนาดตัวอักษรรูทที่ตั้งไว้ ส่วน em คำนวณจากขนาดตัวอักษรบริบท em ที่ตั้งแยกต่างหาก ค่าเริ่มต้นของทั้งสองช่องคือ 16px เท่ากัน จึงทำให้เริ่มต้น 16px เท่ากับ 1rem และ 1em พอดี

กฎที่ควรรู้

ช่องขนาดตัวอักษรรูทและช่องบริบท em ต้องเป็นตัวเลขมากกว่า 0 มิเช่นนั้นจะเห็นข้อความ "ขนาดตัวอักษรรูทต้องเป็นตัวเลขที่มีค่ามากกว่า 0" หรือ "ขนาดตัวอักษรบริบท em ต้องเป็นตัวเลขที่มีค่ามากกว่า 0" ส่วนช่อง "ค่า" หากกรอกสิ่งที่ไม่ใช่ตัวเลขจะเห็นข้อความ "กรุณากรอกตัวเลขเพื่อแปลงค่า" และรับค่าพิกเซลติดลบได้ด้วย

ความเป็นส่วนตัวของข้อมูล

ทุกการแปลงค่าจะทำงานในเบราว์เซอร์ของคุณ ไม่มีการอัปโหลดข้อมูลที่คุณกรอกไปยัง BroBroGo

เหมาะกับใคร

เหมาะกับคนที่ต้องแปลงค่าพิกเซลคงที่เป็น rem หรือ em สำหรับงานที่ต้องปรับขนาดได้ และคนที่ต้องคำนวณ em จากขนาดตัวอักษรขององค์ประกอบใดองค์ประกอบหนึ่งโดยเฉพาะ

คำถามที่พบบ่อย

ถาม: px, rem และ em ต่างกันอย่างไร ตอบ: rem อ้างอิงกับขนาดตัวอักษรรูทของหน้า ส่วน em อ้างอิงกับขนาดตัวอักษรบริบทที่ตั้งแยกต่างหาก เมื่อเริ่มต้นใช้งาน 16px เท่ากับทั้ง 1rem และ 1em

ถาม: หากขนาดตัวอักษรรูทของโปรเจกต์ไม่ใช่ 16px ต้องทำอย่างไร ตอบ: เปลี่ยนค่าในช่อง "ขนาดตัวอักษรรูท (px)" ให้ตรงกับที่ใช้จริง ค่า rem ทั้งหมดจะอัปเดตทันที