簡介 CSS選擇器
上一篇提到要套用樣式，就需要指定某一個特定的元素E 告訴瀏覽器，我就是要把樣式套在這個 E 上面，就像我們作圖時先找出要做特效的圖層然後套用特效一樣。

這個指定元素的部分我們叫做 "選擇器"，也就是利用這個地方來指定特定的元素，其實就是不同的選出元素的方法。
(有點像在教室裡叫第一排站起來，或全部的女生站起來，也許更像在：玩大風吹、吹什麼~ 吹我叫到的元素 E )

選擇器可分成下表裡的類別，看得懂英文的可以直接參考 http://www.w3.org/TR/CSS2/selector.htmlw3c的 selector說明頁(註1)：
除了"全域"、"型態"及最常見的.class, #ID之外，有幾個是類似的選擇法 繼承 偽類 參數

繼承：有分成祖先、父親、E本身、兄弟、子代、後代，利用元素間的空白及+ < 符號來做不同的指定
偽類：就是下表那些用了 :link, :hover 的選法，因為實際上並沒有哪個元素叫做:hover 多半是選擇正在被動作或是某種狀態下的元素，實際上正在做操作的元素也不會是固定的，所以這類型的選擇法叫做 偽類選擇器。
參數：這個大類是用 [] 包起來的，E[類別=值]，例如 a[href="http:chibc.net"],就會選出 <a href="http://chibc.net"> tag<a>的對外連結剛好是連到http://chibc.net的<a> 其他的 <a> 就不會被影响到。

而且選擇器是可以串連並混合運用的，例如：

div.classA p{}
選出 樣式為.classA的div 後代裡的p

div .classA p{}
選出 div 的後代裡叫做 .classA的元素 的後代裡的 p
注意這裡有空格就變成後代選擇器，而不是指同一個元素囉~
沒有空格直接連在一起的是指同一個元素，空格了就變成後代選擇器了。

ul li:first-child{}
選出 ul 後代裡面的是自己父元素的第一個li

同時也可以針對不同的元素指定相同的樣式內容，只要在選擇器之間加上 , 就行了。例如：

h1 ,h2 ,h3{}
就可以將標題一、標題二、標題三都套上在 {}裡的樣式

雖然在CSS裡提供了如此多選出元素的方法，不過一般教學都還是習慣從 .class 及 #ID教起，這兩個是自己取名的樣式，可以幫助你理解你創造的樣式內容為何，所以取名時要注意語義性，最好依HTML內容的結構功能來取名，這樣未來維護時會方便很多，千萬別用DW裡預設的style1, sytle2....這樣到時候要改你就很難找到自己想要修正的樣式了。

====
註1:
http://www.w3.org
W3C是制定現行網頁標準化的一個團體，在web2.0時因為有些瀏覽器廠商沒有加入標準化制定的行列，所以早期瀏覽器在解讀HTML及CSS時常會有不同的呈現(尤其是IE)，所幸在2012的現在，各家廠商都有參加新的W3C標準制定，包括所謂的HTML5及CSS3。這在未來會減少一些跨瀏覽器創作網頁的困擾，不過舊版本的瀏覽器還是或多或少的被使用著，網頁作者可依目標群的瀏覽器佔有率來決定要不要向下支援較舊版的瀏覽器。

chibc-blog 同步