บทนี้จะได้อะไร

จุดประสงค์

จบบทนี้แล้ว คุณจะทำให้หน้าเว็บ ตอบสนองหลายขนาดจอ ได้ — มี viewport ถูกต้อง เขียนแบบ mobile-first ใช้ media queries ปรับเลย์เอาต์ รูปไม่ล้นจอ และมีกลยุทธ์ breakpoint ที่เรียบง่าย

ระดับเป้าหมาย: Intro Web / ทำหน้าเดียวให้ใช้ได้ทั้งมือถือและเดสก์ท็อป

Responsive ไม่ใช่ “ทำสองเว็บ” — เป็นชุดกฎเดียวที่ปรับตามความกว้าง (และเงื่อนไขอื่น) ของวิวพอร์ต