Basic CSS 101
เมื่อเราขึ้นโครงเว็บไซต์ด้วยภาษา HTML ซึ่งเป็นภาษา Markup เรียบร้อยแล้วในบทความก่อน(สอนเขียนเว็บ – พื้นฐาน HTML) โดยเราจะใช้ tag ต่างๆ ที่เราเขียนขึ้นมาใส่ style ให้สวยงาม หลักการเขียน CSS หลักๆ อาจจะต้องพูดถึงเรื่องของ id และ class กันก่อน ผมยกตัวอย่างเช่น
<div id="cat"> กับ <div class="animal">
ตามหลักของ HTML ที่ถูกต้องคือในหนึ่งหน้าเว็บเพจนั้นๆ ไม่ควร หรือ ห้ามมี id ที่ใช้ชื่อเดียวกันมากกว่า 1 แห่ง ส่วน class นั้นสามารถเรียกใช้ชื่อซ้ำได้กี่ครั้งก็ได้ สรุปง่ายๆ คือ id เหมือนกับตัวบ่งบอกเฉพาะเจาะจง หรือเป็น identify ของ object นั้น ที่ต้องทำอย่างนี้ก็เพราะว่า เวลาเขียน CSS หรือ Javascript ก็ตามแต่ จะได้เขียนได้เป็นระเบียบขึ้น และไม่ทำให้ web browser นั้นสับสนที่ต้อง render หน้าเว็บด้วย เวลานำไปใช้ร่วมกับไฟล์ CSS ที่เราได้ลิงค์ไว้ด้วย syntax ด้านล่างนี้
<link href="--ไฟล์--" rel="stylesheet" />#cat{ background-color: red } .animal{ background-color: blue }เราสามารถเขียนแทน id, class ได้โดยการใช้ # สำหรับ id และ . สำหรับ class ยกตัวอย่างเช่น ต้องการใส่พื้นหลังสีแดงให้กับ div ที่ id มีค่าเป็น cat และ ใส่พื้นหลังสีน้ำเงินให้กับ div ที่ class มีค่าเป็น animal ได้ว่า ซึ่งผู้อ่านเองสามารถศึกษาเพิ่มเติมได้จากวิดีโอที่ผู้เขียนได้แนบมาพร้อมกับบทความนี้ ซึ่งหากผู้อ่านยังไม่ค่อยเข้าใจในเรื่องของการเรียกใช้ tag ต่างๆ ของภาษา CSS ก็สามารถทำความเข้าใจได้จากหลากหลายเว็บไซต์ดังเช่น
https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Getting_started
http://www.w3schools.com/css/default.asp
[youtube]https://www.youtube.com/watch?v=Vt1Ouc3T2yM[/youtube]