選擇器學不好，要飯要到老（誤）我認為學好CSS選擇器對於網站效率有很大幫助，當然這點我也還在學習當中。
以下是紀錄CSS的選擇器，文章若有謬誤還請不吝指正m(_ _)m。
選擇器學不好，要飯要到老（誤）我認為學好CSS選擇器對於網站效率有很大幫助，當然這點我也還在學習當中。
以下是紀錄CSS的選擇器，文章若有謬誤還請不吝指正m(_ _)m。

ID selectors-ID選擇器
在CSS檔中寫成#NAME，一個檔案中只會有一個，跟身分證字號是一樣的意思。

Class selectors-Class選擇器
在CSS檔中寫成.NAME，一個Class可以同時套用到多個不同的元素上，就像是“小男孩”、“小女孩”可以有很多個！用來設定樣式很方便，只是名字一多容易混亂，所以Class命名尤其重要...取一堆abc123的，最後哭的一定是自己呀....。

ID只能有一個，Class可以有很多個，那ID跟Class能不能用同一個名字呢？答案是可以的，不過樣式如果有互相衝突，當然會以ID為主，畢竟老大只有一個，他比較大要讓他（喂）
雖然看過有網路文章認為命名使用ID會讓速度比較快，但因為ID同時也是Javascript用來控制的名稱，所以能不用就不用，不然要給程式套的話可是會很頭大的。

Type selectors-屬性選擇器
例如a, h1, div...等等，可直接使用Html元素作選擇器。如果個別元素要一次作全頁設定，用這個就對了：

a { color: #069; }

Universal selector-通用選擇器
只要輕輕的按下一個*字鍵，這個網頁的設定就全聽你的了....頗暴力的做法吶。

* { color: black; }

Descendant combinator-後代選擇器
如果想要讓某區塊“底下”的選擇器全部套用同一個設定的話，就使用後代選擇器，寫法是A（空一格）B。

.test a { color: #555; }

所以.test裡面的a元素通通都會套用到設定，中間又加了甚麼並不會造成影響：

<div class="test">
<a>link</a>
<p>sentence</p>
<a>link</a>
<a>link</a>
</div>

Child combinator-子選擇器
像是父傳子般的繼承樣式，子元素也要在父元素下方才有作用。寫法是A>B。

p>span { color: red; }

以上面的CSS來看，底下這行能不能動呢？

<p>
我是
<i>一隻<span>魚</span></i>
</p>

那麼這行呢XD？

<p>
我是
<i>一隻</i>
<span>魚</span>
</p>

以上是今天的CSS選擇器，晚安！
本文同步發表於http://azzurro.blog.aznc.cc/make_a_website_14/