เปอร์เซ็นต์ เป็น vh

วิธีแปลงเปอร์เซ็นต์เป็น VH?

ในการแปลงเปอร์เซ็นต์เป็น vh คุณต้องรู้ขนาดรวมของฐานและขนาดความสูงของ viewport จากนั้นใช้สูตร: ((percent * base) / 100 / viewport total height) * 100 ตัวอย่างเช่น ด้วยฐาน 1000px และความสูง viewport 1080px 10% จะถูกแปลงเป็น: ((10 * 1000) / 100 / 1080) * 100 = 9.259vh

สูตรการแปลงเปอร์เซ็นต์เป็น VH คืออะไร?

((percent * base) / 100 / ความสูงรวมของ viewport) * 100

หน่วย % คืออะไร? (เปอร์เซ็นต์)

เปอร์เซ็นต์คือตัวเลขหรืออัตราส่วนที่แสดงเป็นเศษส่วนของ 100 มักแสดงด้วยเครื่องหมายเปอร์เซ็นต์ (%) เปอร์เซ็นต์เป็นตัวเลขที่ไม่มีมิติ ใช้เป็นหลักในการแสดงสัดส่วน แต่เปอร์เซ็นต์ก็ยังคงเป็นหน่วยวัดในแง่การสะกดและการใช้งาน ใน CSS มักใช้เพื่อกำหนดขนาดที่สัมพันธ์กับองค์ประกอบแม่ (parent element) ตัวอย่างเช่น หากขนาดขององค์ประกอบแม่คือ 1000px แล้ว 1% จะเท่ากับ 10px, 1% = 10px

• วิกิพีเดีย - เปอร์เซ็นต์
• MDN - <percentage>

หน่วย vh คืออะไร? (ความสูงวิวพอร์ต)

ใช้ในการออกแบบที่ตอบสนอง (responsive design) ความสูงวิวพอร์ต (VH) เป็นหน่วยที่สัมพันธ์กับพื้นที่แสดงผลของหน้าเว็บที่เรียกว่าวิวพอร์ต 1vh เท่ากับ 1% ของการแสดงผล ดังนั้น หากต้องการให้องค์ประกอบมีความสูงเต็ม ควรใช้ 100vh คุณยังสามารถใช้ค่าทศนิยมได้ โปรดทราบว่าความแม่นยำของทศนิยมอาจแตกต่างกันไปตามเบราว์เซอร์

• W3Schools - CSS units
• MDN - CSS units
• MDN - Viewport concepts
• MDN - CSS <length>
• Can I use - Viewport units browsers support