THAIDATAWEB CODE ACADEMY

ศูนย์เรียนรู้และห้องทดลองโค้ดฟรี

เรียนรู้จากพื้นฐานสู่การสร้างเว็บจริง 120 บทเรียนใน 6 เส้นทาง พร้อมแก้โค้ดและดูผลลัพธ์ทันที

120บทเรียน

HTML · ADVANCED

บทที่ 17: รูปภาพ Responsive

เรียนรู้แบบทีละขั้น พร้อมตัวอย่างที่แก้ไขได้และผลลัพธ์ทันที

บทเรียน 17 / 20

เรียนรู้แบบทีละขั้น พร้อมตัวอย่างที่แก้ไขได้และผลลัพธ์ทันที

รูปภาพ Responsive

HTML · ADVANCED

สิ่งที่จะได้เรียนรู้

เข้าใจแนวคิดและการใช้งาน
ทดลองแก้โค้ดตัวอย่าง
ตรวจผลลัพธ์และแก้ข้อผิดพลาด
นำไปต่อยอดในโปรเจกต์จริง

โจทย์ฝึก: ปรับตัวอย่างให้เป็นงานของคุณเอง แล้วตรวจผลลัพธ์อีกครั้ง

เริ่มจากเปลี่ยนข้อความหรือค่าทีละจุด

ช่องเขียนโค้ด

<!doctype html>
<html lang="en">
<head><meta charset="utf-8"><meta name="viewport" content="width=device-width"><title>Responsive Images</title></head>
<body><main><h1>Responsive Images</h1><p>Edit this lesson 17 example.</p></main></body>
</html>

ผลลัพธ์ผลลัพธ์ทำงานในพื้นที่ Sandbox เพื่อความปลอดภัย

⚡ โจทย์ฝึก: ปรับตัวอย่างให้เป็นงานของคุณเอง แล้วตรวจผลลัพธ์อีกครั้ง