สวัสดีครับผม วันนี้กลับมากับแบบฝึกหัดจากคอร์ส Responsive Website Design ในข้อที่ 2 กันนะครับ ลองทำกันดูนะครับ หรือผู้ที่กำลังเริ่มหัดเขียน Responsive ด้วย CSS อยู่ก็สามารถลองทำได้ด้วยนะครับ
โอเคครับ มาเริ่มกันเลยดีกว่า...
โจทย์ของเราก็คือ
1. ให้ออกแบบเว็บไซต์ตาม ภาพที่ 1 เมื่อบราวเซอร์มีขนาดความกว้างมากกว่า 960px ( pixels )
2. และเมื่อย่อขนาดของบราวเซอร์กว้างน้อยกว่า 600px ( pixels ) ให้หน้าเว็บไซต์เปลี่ยนไปเป็นตาม ภาพที่ 2
3. และเมื่อย่อขนาดของบราวเซอร์กว้างมากกว่า 600px ( pixels ) ให้หน้าเว็บไซต์เปลี่ยนไปเป็นตาม ภาพที่ 3
หมายเหตุ : สำหรับโจทย์นี้ใช้แค่ Tag DIV เท่านั้นและใช้อยู่ที่ 6 ตัว หรือน้อยกว่าไม่มากไปกว่านั้นนะครับ มาลองทำดูนะครับ ว่าได้ตามนี้กันหรือเปล่า
หากติดปัญหาตรงไหน สามารถเข้ามาสอบถามได้ที่ Fanpage Who Do Coder ได้เลยนะครับ