แปลงหน่วย CSS
แปลงหน่วย CSS (px, rem, em, %, vh, vw) ได้อย่างง่ายดาย กำหนดขนาดฟอนต์รากเพื่อการแปลง rem/em ที่แม่นยำ จำเป็นสำหรับการออกแบบเว็บ Responsive
Loading tool...
แปลงหน่วย CSS คืออะไร?
CSS Unit Converter ช่วยการออกแบบเว็บโดยแปลงค่าระหว่าง PX, REM, EM และ Percentage โดยอ้างอิงจากขนาดฟอนต์รากของคุณ
ประโยชน์หลัก
- ออกแบบ Responsive
- คุมขนาดฐาน
- แปลงไปกลับ
- หน้าตาสะอาด
กรณีการใช้งาน
- •พัฒนา Frontend
- •ทำ Layout มือถือ
- •การเข้าถึง
- •ปรับแก้ CSS
วิธีแปลงหน่วย CSS
- ป้อนค่า: พิมพ์ค่าที่คุณต้องการแปลง (เช่น 16)
- ตั้งขนาดฐาน: ปรับขนาดฟอนต์รากหากจำเป็น (ค่าเริ่มต้นคือ 16px)
- รับผลลัพธ์: ดูค่าที่แปลงแล้วในหน่วยอื่นๆ ทั้งหมดทันที
คุณสมบัติหลัก
- แปลงระหว่าง px, em, rem, %, vw, vh
- กำหนด base font size
- ตั้งค่า viewport dimensions
- แปลงแบบเรียลไทม์
- พรีเซ็ตการแปลงทั่วไป
- คัดลอกค่าที่แปลง
คำถามที่พบบ่อย
ขนาดฟอนต์ฐานมาตรฐานคือเท่าไหร่?
มาตรฐานคือ 16px ตัวแปลงของเราใช้ค่านี้เป็นค่าเริ่มต้น แต่คุณสามารถปรับได้หากโปรเจกต์ของคุณใช้ขนาดฐานอื่น
ทำไมควรใช้ REM แทน PX?
REM อ้างอิงขนาดฟอนต์ราก ทำให้เว็บเข้าถึงง่ายและ responsive ผู้ใช้ที่ปรับขนาดฟอนต์เบราว์เซอร์จะเห็นเว็บของคุณขยายสัดส่วนได้ถูกต้อง
ควรใช้ EM หรือ REM เมื่อไหร่?
ใช้ REM สำหรับขนาดทั่วไปเพื่อความสม่ำเสมอ ใช้ EM เมื่อต้องการให้ขนาดอ้างอิงกับ element แม่ ซึ่งมีประโยชน์สำหรับ scaling เฉพาะ component
เปอร์เซ็นต์ใน CSS ทำงานอย่างไร?
ขนาดฟอนต์แบบเปอร์เซ็นต์จะอ้างอิงจาก element แม่ ปกติ 100% คือ 16px มันแม่นยำแต่อาจซ้อนทับกันได้ใน element ที่ซ้อนกัน