คลิปต้นทางเป็นบทเรียน CSS สำหรับผู้เริ่มต้นที่ระบุใน transcript ว่าปรับปรุงในปี 2020 และต่อจาก HTML พื้นฐาน บทความนี้สรุปหัวข้อหลักที่ปรากฏในข้อความที่บันทึกไว้ โดยปรับชื่อให้ตรงกับเนื้อหา CSS ซึ่งเป็นจุดเน้นของคลิป
CSS เชื่อมกับ HTML อย่างไร
HTML วางโครงสร้างและเนื้อหาของหน้า ส่วน CSS ใช้กำหนดรูปแบบที่เบราว์เซอร์แสดง ผู้เรียนจึงควรเริ่มจากเข้าใจองค์ประกอบ HTML ที่ต้องการเลือก แล้วจึงเขียนกฎ CSS เพื่อระบุคุณสมบัติและค่าที่ต้องการ
หัวข้อที่ transcript ครอบคลุม
- โครงสร้างกฎ CSS: selector, property และ value
- การเลือก element ด้วยชื่อ tag, class หรือ id และการรวม selector
- รูปแบบการใส่ CSS ในหน้า: inline, internal และ external stylesheet
- comment ใน CSS และแนวคิดเรื่องหน่วยวัดแบบ absolute กับ relative
การรู้จักหน่วยวัดหรือ selector อย่างเดียวไม่ได้ทำให้หน้าเว็บ responsive หรือเข้าถึงได้ดีโดยอัตโนมัติ ควรทดลองกับหลายขนาดหน้าจอ ตรวจลำดับความสำคัญของกฎ และทดสอบความอ่านง่ายจริง
ตรวจรายละเอียดกับเอกสารปัจจุบัน
วิดีโอเป็นบทเรียนปี 2020; ใช้ เอกสาร CSS ของ MDN สำหรับ reference ของภาษาและคุณสมบัติ และดู บทเรียน CSS styling basics เพื่อฝึก selector และกฎ CSS ในบริบทปัจจุบัน
เรียนต่อจาก CSS
ถ้ายังไม่คุ้นกับโครงสร้างหน้า เริ่มจาก พื้นฐาน HTML5 แล้วต่อด้วย JavaScript สำหรับผู้เริ่มต้น เพื่อดูวิธีเพิ่มพฤติกรรมให้หน้าเว็บ
transcript ใน workbook มี 45,000 ตัวอักษรถึงเพดานส่งออก จึงอาจไม่ครบทุกช่วงของคลิป เราเทียบข้อความเท่านั้นและไม่ได้ยืนยันเสียง