CSS的宣告內容分為「選擇器(Selector)」和「宣告區」兩個部分。選擇器在於指定宣告的對象，宣告區則是指定該對象的樣式屬性及其屬性值(可以為空白)。
宣告區以一組大括號「{ }」括弧起來，裡面可以宣告0個以上的屬性及其屬性值。屬性和屬性值之間用「：」冒號區隔起來，屬性定義之間和最後結尾必須加上「；」分號。注意，屬性值不須加上('')單引號或(" ")雙引號
類型選擇器(Type Selectors)
 |
p { color : red ; } |
|---|
直接指定像p、div等具體的元素名，將樣式套用上去。如右上範例所示，段落p元素內的文字都用紅色修飾。
子孫選擇器(Descendant Selectors)
 |
p em{ color : red ; } |
|---|
指定親元素以及其子孫元素，中間以半形空白區隔。樣式將套用於該親元素內的子孫元素。如右上範例所示，無論段落p元素內有多少階層，其底下的所有強調文字em元素的內容都用紅色修飾。
通用選擇器(Universal selectors）
 |
p *{ color : red ; } |
|---|
指定親元素以及通用符號(*)，中間以半形空白區隔。樣式將套用於此元素內的所有子元素。如右上範例所示，並非段落p元素而是它底下的所有子元素內的文字都用紅色修飾。
群組選擇器(Grouping selectors）
 |
em,i { color : red ; } |
|---|
指定2個以上的元素使用(,)逗號區隔，形成群組元素。樣式將套用於此群組元素上。如右上範例所示，強調文字em元素和斜體文字i元素的所有文字都用紅色修飾。
類別選擇器(Class selectors）
  |
.samp { color : red ; } p.samp { color : red ; } |
|---|
欲指定的類別名稱前加(.)逗點。樣式將套用在有記述「class=”類別名”」的元素上。如右上範例所示，.samp{color:red}表示有記述「class="samp"」的元素的所有的文字都用紅色修飾。p.samp{color:red}表示只有記述「class="samp"」的段落p元素(<p class="samp">～</p>)的所有的文字都用紅色修飾。
ID選擇器(ID selectors）
  |
#Myid { color : red ; } p#Myid { color : red ; } |
|---|
欲指定的ID名稱前加(#)符號。樣式將套用在有記述「id="ID名"」的元素上。如右上範例所示，#Myid { color : red ; }表示有記述「id="Myid"」的元素的所有的文字都用紅色修飾。p#Myid { color : red ; }表示只有記述「id="Myid "」的段落p元素(<p id="Myid">～</p>)的所有的文字都用紅色修飾。
子選擇器(Child selectors)
 |
p > em { color : red ; } |
|---|
指定親元素以及其子元素，中間加上(>)符號。樣式將套用於該親元素內的直接子元素。如右上範例所示，段落p元素直下的強調文字em元素的文字都用紅色修飾。但是「<p><h1>綜合<em> IT </em>情報網</h1></p>」的強調文字em元素不是段落p元素直接的子要素，因此不適用此規則。這是和子孫選擇器不同的地方。
*1)Windows IE 6以下不對應，IE 7以上對應相鄰選擇器(Adjacent sibling selectors)
 |
h1+h2 {margin-top:1em} |
|---|
指定親元素以及其相鄰元素，中間加上(+)符號。樣式將套用於元素1緊接相鄰的元素2上。如右上範例所示，緊接相鄰標題h1元素的標題h2元素的上邊界距離為1倍文字。但是其他不相鄰的標題h2元素不適用此規則。
*1)Windows IE 6以下不對應，IE 7以上對應屬性選擇器(Attribute selectors)
    |
input[type] input[type="submit"] a [rel~="next"] p[xml:lang|="en"] |
|---|
指定元素的屬性名使用([ ])符號括起，屬性名的屬性值則用(" ") 符號括起。如右上範例(Sample)所示：
*1)Windows IE 6以下不對應，IE 7以上對應