1、元素選擇器：往往是HTML元素，也可能是XML定義的元素，舉例：

h1 {color:red;}/* 元素選擇器 */
h2 {font:normal 12px/16px “Courier New”,Arial;}/* css關(guān)鍵字由空格隔開，只有font屬性中字體大小和行高可用“/”分割 */
h3,p {background-color:#EEE;}/* 選擇器的分組 */

2、通配選擇器，它為頁面中所有元素添加樣式，就像是一個通配符，舉例：

* {color:blue;}/* 通配選擇器，等價于列出了文檔中所有元素的color屬性均為blue，它的優(yōu)先級很低 */
*.p {font-weight:bold;}/* 類選擇器，運(yùn)用到所有類為p的元素上，可以忽略(*)號，等價于.p */

3、類選擇器：多的不廢話，說一下多類選擇器吧，舉例：
有如下HTML代碼：

<p class=”p”>This is a paragraph</p><!– 類選擇符 –>
<div class=”p”>This is a div element</div><!– 類選擇符 –>
<p class=”urgent warning”>This is a paragraph</p><!– 多類選擇符，一個class可以包含一個詞列表，各個詞之間用空格隔開 –>
<p class=”urgent warning help”>Those words’s background-color is red too in all browser!</p><!– 多類選擇符，.waring.urgent選擇器將不能匹配這里的p –>
<p class=” help ie6″>Those words’s background-color is red in browser ie6!</p><!– 多類選擇符，由于help在選擇器中最后出現(xiàn)，所以在IE6中背景為紅色的 –>
<p class=”help”>Those words’s background-color is red in browser ie6!</p><!– 類選擇符，由于help在選擇器中最后出現(xiàn)，所以在IE6中背景為紅色的 –>
<p>This is a paragraph<span class=”warning”> But this is a span element</span></p>

CSS風(fēng)格如下：

p.p {font-style:italic;}/* 類選擇器，選擇段落且類為p時才顯示粗體 */
.waring {font-weight:bold;}
.urgent {font-style:italic;}
.warning.urgent {background-color:silver;}/* 類選擇器，選擇同時包含waring和urgent兩個類的元素，且出現(xiàn)的順序可以和定義class時不同 */
p.warning.urgent.help {background-color:red;}/* 類選擇器，選擇同時包含waring,urgent和help三個類的p元素，但是在IE6中此選擇符匹配class屬性中包含help的所有p元素 */

在非IE6下面，CSS里如果有.warning.urgent.help這類的選擇器，它只匹配同時包含waring,urgent和help三個類的HTML元素，而HTML中諸如class="urgent warning help"這類的選擇器卻可以匹配CSS中多種樣式；而在IE6下卻不同，這一點(diǎn)是很值得注意的。
4、ID選擇器：比起類選擇器來說，ID選擇器不會那么復(fù)雜，ID屬性不允許有以空格分隔的詞列表，比如以下的寫法是不對的：