因此，首先需要掌握的就是如何通過CSS來選擇頁面上的元素。
CSS選擇元素的方法可以分爲這樣幾類，下面做一一介紹。
1.元素選擇器
html元素，即標籤是最基本的選擇器，可以直接使用這些標籤來定義樣式。例如：p {color:gray;} h1 {color:blue;}2.類選擇器
class選擇器用於選擇一組元素，將樣式添加到這組元素的每個元素上。例如.red{color:red}
可以作用於文檔中每個class定義爲red的元素：
<p class="red">這是一個晴朗的早晨</p>，<h1 class="red">鴿哨聲伴着起牀號音</h1>
同時，類選擇器還可以限定作用域。例如，只是在段落p上定義一個類red:
p.red{color:red}
這樣，這個類就只能對段落中class定義爲red的元素起作用：
<p class="red">這是一個晴朗的早晨</p>
3.ID選擇器
與class選擇器不同，一個id的一個頁面上只能出現一次。例如.mostImportant{color:red;}
在頁面上指定相應的元素:<p id="mostImportant">這是一個晴朗的早晨，鴿哨聲伴着起牀號音。</p>
4.屬性選擇器
可以根據元素是否設置了某個屬性，或者屬性值來選擇元素。例如：->選擇所有設置了alt屬性的img元素:img[alt] {border: 5px solid red;}
->選擇所有alt屬性爲"001.jpg"的img元素:img[alt="001.jpg"] {border: 5px solid red;}
5.後代選擇器
所謂後代選擇器是指選取指定元素之下的所有匹配元素。例如，頁面分爲left和right兩部分，現在要求left部分的所有鏈接樣式默認爲紅色，而right部分爲綠色。可以這樣設置：
#left a:link{color:red;}
#right a:link{color:green;}
注意，這裏的後代是指所有後代節點，並不一定得是直接子節點。
6.子元素選擇器
與後代選擇器不同，這裏的子元素選擇器是指直接子元素，而不是所有後代元素。例如，要選取right層直接子節點中所有類名爲item的元素：
#right>.item{color:red;}
7.相鄰兄弟元素選擇器
這個選擇符的作用是選擇指定元素之後緊接的元素。例如#div1 + .div2{color:red;}爲選擇緊接在div1後面的指定類名爲div2的元素。
8.首元素選擇器
選擇第一個元素。例如：選擇第一個類名設置爲item的元素.item:first-child{color:red;}
9.鏈接僞類選擇器
a:link{}未訪問的鏈接樣式a:visited{}已經訪問的鏈接樣式
a:hover{}鼠標懸停時的鏈接樣式
a:active{}選定的鏈接樣式
10.僞元素選擇器
p:first-line{}選擇第一行p:first-letter{}選擇首字母
css的選擇器大體上就是這麼多。當然這只是一個很簡單的輪廓描述，需要在實際編寫代碼的過程中加深認識，熟練綜合高效運用選擇器做樣式佈置。