CSS常見的選擇器有：
通配符選擇器, 元素選擇器，類選擇器， ID選擇器，後代選擇器
CSS3新增基本選擇器有：
子元素選擇器，相鄰兄弟選擇器，通用兄弟選擇器，羣組選擇器
基本選擇器—-子元素選擇器
概念：子元素選擇器只能選擇某元素的子元素
語法格式：
父元素 > 子元素 (father > children )
兼容性：
IE8+，FireFox，Chrome，Safari，Opera
基本選擇器—-相鄰兄弟元素選擇器
概念：相鄰兄弟元素選擇器可以選擇緊接在另一個元素後的元素，而且他們具有一個相同的父元素
語法格式：
元素+兄弟相鄰元素 (Element + Sibling)
兼容性：
IE8+ , FireFox，Chrome，Safari，Opera
基本選擇器—-通用兄弟選擇器
概念：選擇某元素後面的所有兄弟元素，而且他們具有一個相同的父元素
語法格式：
元素~後面的所有兄弟元素 (Element~Siblings)
兼容性：
IE8+ , FireFox，Chrome，Safari，Opera
基本選擇器—-羣組選擇器
概念：羣組選擇器是將具有相同樣式的元素分子在一起，每個選擇器之間使用逗號“，”隔開
語法格式：
元素1，元素2，……，元素N (Element1,Element2,……,Elementn)
兼容性：
IE6+ , FireFox，Chrome，Safari，Opera
CSS3屬性選擇器
對帶有制定屬性的HTML元素設置樣式
使用CSS3屬性選擇器，你可以只指定元素的某個屬性，或者你還可以同時指定元素的某個屬性其對應的屬性值。
概念：爲帶有attribute屬性的Element元素設置樣式
語法：Element[attribute]
兼容性：IE8+ , FireFox，Chrome，Safari，Opera
概念：爲attribute=”value” 屬性的Element元素設置樣式
語法：Element[attribute=”value”]
兼容性：IE8+ , FireFox，Chrome，Safari，Opera
概念：選擇attribute屬性包含“value
“的元素，並設置其樣式
語法：Element[attribute~=”value”]
兼容性：IE8+ , FireFox，Chrome，Safari，Opera
注意：當div[title~=f]時，
<img src="/statics/images/course/klematis.jpg" title="klematis ff" width="150" height="113" />
<img src="/statics/images/course/img_flwr.gif" title="f" width="224" height="162" />
兩個img標籤中只有第二個會被選中，因此這個選擇器不是模糊查詢
概念：設置attribute屬性值以“value”開頭的所有Element元素的樣式
語法：Element[attribute^=”value”]
兼容性：IE8+ , FireFox，Chrome，Safari，Opera
概念：設置attribute屬性值以“value”結尾的所有Element元素的樣式
語法：Element[attribute$=”value”]
兼容性：IE8+ , FireFox，Chrome，Safari，Opera
概念：設置attribute屬性值包含“value”的所有Element元素的樣式
語法：Element[attribute*=”value”]
兼容性：IE8+ , FireFox，Chrome，Safari，Opera
概念：選擇attribute屬性值爲“value”或以“value-”開頭的元素，並設置其樣式
語法：Element[attribute|=”value”]
兼容性：IE8+ , FireFox，Chrome，Safari，Opera
注意：這個選擇器不是模糊查詢
CSS3僞類選擇器
包括：
動態僞類（錨點僞類，用戶行爲僞類）
動態僞類：
這些僞類並不存在HTML中，只有當用戶和網站交互的時候才能體現出來
錨點僞類：
:link，:visited（訪問之後）
用戶行爲僞類：
:hover（鼠標經過），:active（鼠標點擊），:focus（input光標選中）
UI元素狀態僞類
概念：我們把”:enabled(可輸入)”，”:disabled(不可輸入)”，”:checked(選中狀態，僅兼容Opera)”僞類稱爲UI元素狀態僞類
兼容性：IE9+，Firefox，Chrome，Safari，Opera
CSS3結構類
我們把CSS3 的:nth選擇器稱爲CSS3結構類
選擇方法：
:first-child，:last-child，:nth-child()，:nth-last-child()，:nth-of-type()，:nth-last-of-type()，:first-of-type，:last-of-type，:only-child，:only-of-type，:empty
Element:first-child
概念：選擇屬於父元素的首個子元素的每個Element元素，併爲其設置樣式
兼容性：IE8+，Firefox，Chrome，Safari，Opera
Element:last-child
概念：指定屬於其父元素的最後一個元素的Element元素的樣式
兼容性：IE8+，Firefox，Chrome，Safari，Opera
Element:nth-child(N)
概念：匹配屬於其父元素的第N個子元素，不論元素的類型
n是一個簡單的表達式，取值從0開始計算。這裏只能是n，不能用其他字母代替。
Element:nth-child(odd)，Element:nth-child(even)
odd和even是可用於匹配下標是奇數或偶數的Element元素的關鍵詞（第一個的下標是1）
兼容性：IE8+，Firefox4+，Chrome，Safari，Opera
Element:nth-last-child(N)
概念：匹配屬於其元素的第N個子元素的每個元素，不論元素的類型，從最後一個子元素開始計數
兼容性：IE9+，Firefox4+，Chrome，Safari，Opera
Element:nth-of-type(N)
概念：匹配屬於父元素的特定類型的第N個子元素的每個元素
兼容性：IE9+，Firefox4+，Chrome，Safari，Opera
Element:nth-of-last-type(N)
概念：匹配屬於父元素的特定類型的第N個子元素的每個元素，從最後一個子元素開始計數
兼容性：IE9+，Firefox4+，Chrome，Safari，Opera
Element:first-of-type
概念：匹配屬於其父元素的特定類型的首個子元素的每個元素
Element:last-of-type
概念：匹配屬於父元素的特定類型的最後一個子元素的每個元素
兼容性：IE9+，Firefox，Chrome，Safari，Opera
Element:only-child
概念： :only-child選擇器匹配屬於其父元素的唯一子元素的每個元素(即：父元素下只有一個元素且匹配)
兼容性：IE9+，Firefox，Chrome，Safari，Opera
Element:only-of-type
概念： :only-of-type選擇器匹配屬於其父元素的特定類型的唯一子元素的每個元素(即：父元素下的子元素只有一個特定類型的元素且匹配，其他類型可忽略)
兼容性：IE9+，Firefox4+，Chrome，Safari，Opera
Element:empty
概念：匹配沒有子元素（包括文本節點）的每個元素
兼容性：IE9+，FireFox，Chrome，Safari，Opera
否定選擇器（:not）
概念：not(Element/selector)選擇器匹配非指定元素/選擇器的每個元素
語法：父元素:not(子元素/子選擇器)（Father:not(Children/selector)）
兼容性：IE9+，FireFox，Chrome，Safari，Opera
僞元素
CSS僞元素用於向某些選擇器設置特殊效果
語法格式：元素::僞元素 （Element::pseudo-element）
兼容性：IE9+，FireFox，Chrome，Safari，Opera
僞元素—Element::first-line
概念：根據“first-line”僞元素中的樣式對Element元素的第一行文本進行格式化
說明：“first-line”僞元素只能用於塊級元素
僞元素—Element::first-letter
概念：用於向文本的首字母設置特殊樣式
說明：“first-letter”僞元素只能用於塊級元素
僞元素—Element::before
概念：在元素的內容前面插入新內容
說明：常用“content”配合使用
僞元素—Element::after
概念：在元素的內容後面插入新內容
說明：常用“content”配合使用，多用於清除浮動
僞元素—Element::selection
概念：用於設置在瀏覽器中選中文本後的背景色與前景色
兼容性說明：IE瀏覽器只有IE9支持，在火狐中需要加上前綴“-moz”
CSS權重
什麼是權重：當很多的規則被應用到某一個元素上時，權重是一個決定哪種規則生效，或者是優先級的過程
權重等級與權值： 行內樣式（1000）>ID選擇器（100）>類，屬性選擇器和僞類選擇器（10）>元素和僞元素（1）>*（0）
權重計算口訣： 從0開始，一個行內樣式+1000，一個id+100，一個屬性選擇器，class或者僞類+10，一個元素名或者僞元素+1
CSS權重規則
包含更高權重選擇器的一條規則擁有更高的權重
ID選擇器（#idValue）的權重比屬性選擇器（[id=“idValue”]）高
帶有上下文關係的選擇器比單純的元素選擇器權重要高
與元素“捱得近”的規則生效
最後定義的這條規則會覆蓋上面與之衝突的規則
無論多少個元素組成的選擇器，都沒有一個class選擇器權重高
通配符選擇器權重視0，被繼承的CSS屬性也帶有權重，權重也是0