CSS Syntax รูปแบบการเขียนโค้ด CSS

รูปแบบการเขียนโค้ด CSS จะประกอบด้วย selector และ declaration block ซึ่งมีรูปแบบดังนี้ selector{property: value; property: value;}

• selector คือ ชื่อแท็ก, คลาส, ไอดี ของ html element ที่เราต้องการกำหนดสไตล์ให้ เช่น p, div, h1 เป็นต้น
• declaration block คือ กรอบ หรือขอบเขตสำหรับเขียนโค้ดกำหนดสไตล์ด้วย css จะถูกกำหนดด้วยเครื่องหมายวงเล็บปีกกาเปิดปิด {} curly braces
• property คือ ชื่อคุณสมบัติที่เราจะกำหนดสไตล์ให้ เช่น color (สีตัวอักษร), font-size (ขนาดตัวอักษร) เป็นต้น
• value คือ ค่าที่ต้องการกำหนดให้กับ property
  • จะต้องคั่นระหว่าง property กับ value ด้วยเครื่องหมายโคลอน : เสมอ
  • จะต้องปิท้าย value ด้วยเครื่องหมายเซมิโคลอน ; เสมอ

ตัวอย่างการเขียนโค้ด CSS

p {
  color: red;
  text-align: center;
}

• p คือ selector หมายถึง เราจะกำหนดสไตล์ให้แท็ก p ทั้งหมดในหน้าเพจ
• เครื่องหมาย {} คือขอบเขตของ declaration block
• color คือ property หมายถึง กำหนดค่าสี
• red คือ value หมายถึง กำหนดค่าสีแดงให้กับพร็อพเพอร์ตี้ color