เครื่องแปลงพิกเซลเป็น EM/REM
แปลง px, rem, em, pt และ % พร้อมตารางแบบเรียลไทม์และ CSS พร้อมคัดลอก
rem สัมพันธ์กับขนาดฟอนต์ราก; em และ % สัมพันธ์กับแม่
| PX | REM | EM | PT |
|---|---|---|---|
| 10 | — | — | — |
| 12 | — | — | — |
| 14 | — | — | — |
| 16 | — | — | — |
| 18 | — | — | — |
| 20 | — | — | — |
| 24 | — | — | — |
| 28 | — | — | — |
| 32 | — | — | — |
| 40 | — | — | — |
| 48 | — | — | — |
| 64 | — | — | — |
เกี่ยวกับ เครื่องแปลงพิกเซลเป็น EM/REM
ตัวแปลง pixel เป็น EM/REM แปลงค่าความยาว CSS ระหว่าง px, rem, em, pt และ percent ป้อนค่าในหน่วยใดก็ได้จากห้าหน่วยนี้ แล้วตารางแบบเรียลไทม์จะแสดงค่าเทียบเท่าในหน่วยอื่นทั้งหมด พร้อมโค้ด CSS ที่พร้อมคัดลอกไปวางในสไตล์ชีตได้เลย
การแปลงเป็นไปตามวิธีที่ CSS แปลค่าหน่วยจริง ๆ คือ rem อ้างอิงกับขนาดฟอนต์ของ root ในขณะที่ em และ % อ้างอิงกับขนาดฟอนต์ขององค์ประกอบแม่ ทั้งสองค่าอ้างอิงสามารถแก้ไขได้ จึงจำลองได้ทั้ง root 16 px กับคอมโพเนนต์ 14 px หรือระบบสัดส่วนการออกแบบใดก็ตามที่คุณใช้
ตารางค่าที่นิยมใช้ระบุขนาดที่นักออกแบบเลือกใช้บ่อยที่สุด ทำให้คำถามอย่าง "24px คือกี่ rem" ได้คำตอบในทันที เครื่องมือนี้ฟรี อัปเดตขณะพิมพ์ และเป็นเครื่องมือหลักสำหรับแปลงงานออกแบบที่ใช้พิกเซลตายตัวให้เป็น CSS แบบ rem ที่เข้าถึงได้และปรับขนาดได้
วิธีใช้ เครื่องแปลงพิกเซลเป็น EM/REM
- ป้อนค่าที่จะแปลงและเลือกหน่วยของมัน: px, rem, em, pt หรือ %
- ปรับขนาดฟอนต์ root (สำหรับ rem) และขนาดฟอนต์ของแม่ (สำหรับ em และ %) หากต่างจาก 16 px
- อ่านค่าที่แปลงแล้วในตารางแบบเรียลไทม์
- คัดลอกโค้ด CSS ที่สร้างขึ้น หรือค่าใด ๆ จากตารางค่าที่นิยมใช้