rem เป็น vw
ตัวแปลงที่คำนวณ vw จาก rem สำหรับขนาด rem และความกว้าง viewport ที่กำหนด เพื่อทำให้การวัดเป็นแบบ responsive
ปุ่มลัด
คำนวณและคัดลอกผลลัพธ์การคำนวณ
คำนวณผลลัพธ์
คัดลอกผลลัพธ์การคำนวณ
สลับตัวแปลงเป็น "VW เป็น REM"
โฟกัสไปที่ช่องกรอก "REM"
โฟกัสไปที่ช่องกรอก "ขนาด REM"
โฟกัสไปที่ช่องกรอก "ความกว้างวิวพอร์ต"
FAQ
วิธีแปลง REM เป็น VW?
ในการแปลง rem เป็น vw คุณต้องทราบขนาดรวมของ 1 REM (ค่าเริ่มต้น 16px) และความกว้าง viewport จากนั้นใช้สูตร: ((rem * ขนาด rem) / vw) * 100 ตัวอย่างเช่น ด้วย 16px สำหรับ 1rem และ 1920px ความกว้าง viewport, 1rem จะถูกแปลงเป็น: ((1 * 16) / 1920) = 0.833vw
สูตรการแปลง REM เป็น VW คืออะไร?
((rem * ขนาด rem) / vw) * 100
หน่วย rem คืออะไร?
REM ถูกกำหนดโดยสัมพันธ์กับขนาดตัวอักษรของ root element โดย root element จะถูกจับคู่ด้วย :root pseudo-class หรือตัวเลือก html ดังนั้น 1 REM จึงมีค่าเท่ากับที่กำหนดไว้ใน font-size ของ root element ซึ่งหมายความว่า 1 REM จะคงค่าเดิมไว้ตลอดทั้งโค้ด CSS ของคุณ
หน่วย vw คืออะไร? (ความกว้างวิวพอร์ต)
ใช้ในการออกแบบที่ตอบสนอง (responsive design) ความกว้างวิวพอร์ต (VW) เป็นหน่วยที่สัมพันธ์กับพื้นที่แสดงผลของหน้าเว็บที่เรียกว่าวิวพอร์ต 1vw เท่ากับ 1% ของการแสดงผล ดังนั้น หากต้องการให้องค์ประกอบมีความกว้างเต็ม ควรใช้ 100vw คุณยังสามารถใช้ค่าทศนิยมได้ โปรดทราบว่าความแม่นยำของทศนิยมอาจแตกต่างกันไปตามเบราว์เซอร์
ตารางการแปลง REM เป็น VW เมื่อขนาด rem คือ 16px และขนาดความกว้าง viewport คือ 1920px
| rem | vw |
|---|---|
| 1rem | 0.833vw |
| 2rem | 1.667vw |
| 3rem | 2.5vw |
| 4rem | 3.333vw |
| 5rem | 4.167vw |
| 6rem | 5vw |
| 7rem | 5.833vw |
| 8rem | 6.667vw |
| 9rem | 7.5vw |
| 10rem | 8.333vw |
| 11rem | 9.167vw |
| 12rem | 10vw |
| 13rem | 10.833vw |
| 14rem | 11.667vw |
| 15rem | 12.5vw |
| 16rem | 13.333vw |
| 17rem | 14.167vw |
| 18rem | 15vw |
| 19rem | 15.833vw |
| 20rem | 16.667vw |
| 21rem | 17.5vw |
| 22rem | 18.333vw |
| 23rem | 19.167vw |
| 24rem | 20vw |
| 25rem | 20.833vw |
การแปลง REM และ VW เพิ่มเติม

