selector { property:value }- selector สามารถเป็น HTML Tag ต่างๆ เช่น <body>, <p> หรือเป็น Class name หรือ ID ที่เราตั้งชื่อให้ก็ได้
selector { property1:value1; property2:value2 }
- property คือ คุณสมบัติในการจัดรูปแบบการแสดงผล เช่น color สำหรับกำหนดสี, font-size สำหรับกำหนดขนาดตัวอักษร
- value เป็น ค่า ที่เรากำหนดให้กับ property ต่างๆ เช่น color:white, font-size:14px
ตัวอย่างคำสั่ง CSS
กำหนดให้ข้อความที่อยู่ใน Tag <p> เป็นสีดำ และวางอยู่กึ่งกลาง
/* selector ที่เป็น HTML Tag */p {color:#000000;text-align:center}กำหนดให้ข้อความที่ class name topic เป็นสีแดง ชนิดอักษรเป็น Arial ตัวหนา และจัดวางอยู่กึ่งกลาง
/* selector ที่เป็น Class name */.topic{color:red; font-family:Arial; font-weight:bold; text-align:center }
กรณีที่ selector มีค่า property เหมือนกัน สามารถเขียนรวมกันได้ โดยใช้เครื่องหมาย "," คั่นระหว่าง selector
กำหนดให้ข้อความใน Tag <h1>,<h2> และ <h3> เป็นสีแดง ชนิดตัวอักษรเป็น sans-serifh1, h2, h3 {color:red;font-family:sans-serif }
Comment
ใน Style Sheet Comment จะใช้เครื่องหมาย "/*" เป็นการเปิด และ "*/" เป็นการปิด เช่น
/* นี่คือ comment กำหนดสีตัวอักษรเป็นสีดำ ขนาด14px */body {color:#000000;font-size:14px}