การออกแบบเว็บที่ตอบสนอง - Viewport
วิวพอร์ตคืออะไร?
หน้าผู้ใช้ viewport พื้นที่ดู
วิวพอร์ตสามารถแปลเป็นภาษาจีนเรียกว่า "วิวพอร์ต."
เบราว์เซอร์มือถือเป็นหน้า "หน้าต่าง" ซึ่งเป็นเสมือน (วิวพอร์ต) นี้มักจะ "หน้าต่าง" เสมือน (วิวพอร์ต) กว้างกว่าหน้าจอเพื่อให้คุณไม่ได้ที่จะบีบทุกหน้าหน้าต่างเล็ก ๆ (จะนี้ รูปแบบความเสียหายไม่เหมาะสำหรับหน้าเบราว์เซอร์บนมือถือ) ผู้ใช้สามารถเลื่อนและซูมเพื่อดูส่วนต่าง ๆ ของหน้า
ตั้งค่าวิวพอร์ต
เมตาแท็กวิวพอร์ตสำหรับมือถือหน้าเว็บที่ดีที่สุดที่พบบ่อยมีดังนี้
- ความกว้าง: ควบคุมขนาดของวิวพอร์ตที่มีค่าสามารถระบุถ้า 600 หรือค่าพิเศษเช่นอุปกรณ์ที่มีความกว้างของความกว้างของอุปกรณ์ (พิกเซล CSS ปรับขนาดถึง 100% ของเวลา)
- ความสูง: ความกว้างและความสอดคล้องกับความสูงที่กำหนด
- เริ่มต้นขนาด: ขนาดเริ่มต้นนั่นคือเมื่อระดับเวลาในการโหลดหน้าแรก
- สูงสุดขนาด: ช่วยให้ผู้ใช้เพื่อขยายอัตราส่วนสูงสุด
- ขั้นต่ำขนาด: ช่วยให้ผู้ใช้ที่จะไต่ระดับต่ำสุด
- ผู้ใช้สามารถปรับขยายได้: ไม่ว่าผู้ใช้เองสามารถซูม
ตัวอย่างต่อไปนี้แสดงให้เห็นถึงการใช้งานของวิวพอร์ตโดยใช้ viewport และไม่เกี่ยวกับผลข้างเคียงที่มือถือ:
ตัวอย่างที่ 1 ไม่ได้ถูกเพิ่มวิวพอร์ต: คลิกเพื่อดู
ตัวอย่างที่ 2 เพิ่มวิวพอร์ต: คลิกเพื่อดู
หากคุณเข้าชมในแท็บเล็ตหรือโทรศัพท์คุณสามารถคลิกเพื่อดูผล