เมื่อเขียนหน้าโทรศัพท์มือถือ HTML5 เราจะพบว่าสัดส่วนขององค์ประกอบที่แสดงบนหน้านั้นไม่ถูกต้อง
<meta name = viewport content = width = ความกว้างของอุปกรณ์, ระดับเริ่มต้น = 1>
ทั้ง
<meta name = viewport content = width = ความกว้างของอุปกรณ์, ระดับเริ่มต้น = 1.0, ระดับต่ำสุด = 0.5, ระดับสูงสุด = 2.0, scalable ผู้ใช้ = ใช่ />
แล้วขออธิบายประโยคนี้กันเถอะ:
Viewport: มันหมายถึงหน้าต่างแสดงผล;
ความกว้าง = ความกว้างของอุปกรณ์ระดับเริ่มต้น = 1.0: หมายถึงความกว้างของหน้าต่างแสดงผลเท่ากับความกว้างของหน้าจอของอุปกรณ์ระดับเริ่มต้น = 1.0 นั่นคืออัตราส่วนการซูมเริ่มต้นคือ 1.0;
ระดับต่ำสุด: หมายถึงอัตราส่วนขั้นต่ำที่อนุญาตให้ได้รับอนุญาต
สูงสุด: หมายถึงอัตราส่วนสูงสุดที่อนุญาตให้ปรับขนาดได้
ผู้ใช้สามารถลดขนาดได้: หมายความว่าผู้ใช้อนุญาตให้ผู้ใช้ scate หน้าหรือไม่
ตัวอย่างปัญหา: ปรากฏการณ์:เมื่อผู้ใช้คลิกที่กล่องอินพุตอินพุตบนหน้ามือถือเพื่อแก้ไขข้อความหน้าจะขยายโดยอัตโนมัติ
แก้ปัญหา:แทรกในหัวของหน้า <head> ฉลาก
<meta name = viewport content = width = ความกว้างของอุปกรณ์, ระดับเริ่มต้น = 1.0, ระดับต่ำสุด = 1.0, ระดับสูงสุด = 1.0 />
หรือผู้ใช้ไม่ได้รับอนุญาตให้ซูมหน้าผู้ใช้ที่สามารถลดขนาดได้ = ไม่
สรุปข้างต้นเป็นปัญหาของการแก้ไขหน้าโทรศัพท์มือถือ HTML5 ที่ฉันแนะนำให้รู้จักกับคุณ ขอบคุณมากสำหรับการสนับสนุนเว็บไซต์ Vevb Wulin!