เทคนิคแยกสไตล์ให้ดูแลง่าย

ลำดับการทำงานที่แนะนำ

1) เขียน HTML ให้โครงถูกต้องก่อน

2) สร้าง css/style.css และลิงก์ด้วย <link>

3) ตั้งค่าพื้นฐานที่ body (สี ตัวอักษร)

4) ใช้ class ตั้งชื่อตามบทบาท เช่น .lead, .title — ไม่ตั้งชื่อตามสีอย่างเดียวถ้าหลีกเลี่ยงได้

5) เปิดเบราว์เซอร์ตรวจ แล้วค่อยปรับทีละ property

ชื่อ class บอก “หน้าที่” ดีกว่าบอก “สี” — .warning ปรับธีมทีหลังง่ายกว่า .red-text

แบบฝึกปฏิบัติ

ลองทำตามรายการด้านล่างในเบราว์เซอร์หรือไฟล์ของคุณ — ไม่มีตรวจอัตโนมัติในเฟสนี้

สร้างโปรเจกต์โฟลเดอร์พร้อม index.html และ css/style.css แล้วลิงก์ให้สี body เปลี่ยนชัดเจน
ง่าย