基本選擇器

通配選擇器

選擇器：*

類型：通配選擇器

含義：選擇文檔中所有的HTML元素

元素選擇器

選擇器：E

類型：元素選擇器

含義：選擇指定類型的HTML元素

ID選擇器

選擇器：#ID

類型：ID選擇器

含義：選擇指定ID屬性值為“ID”的HTML元素

類選擇器

選擇器：.class

類型：類選擇器

含義：選擇指定class屬性值為“class”的HTML元素

群組選擇器

選擇器：.selctor1,selector2,...selectorN

類型：群組選擇器

含義：將每一個選擇器匹配的元素合并到一起

層次選擇器

后代選擇器

選擇器：E F

類型：層次選擇器

含義：匹配所有屬于E元素后代的F元素

子選擇器

選擇器：E > F

類型：子選擇器

含義：匹配所有E元素的子元素F

相鄰兄弟選擇器

選擇器：E + F

類型：相鄰兄弟選擇器

含義：匹配所有相鄰E元素之后的同級元素F

通用選擇器

選擇器：E ~ F

類型：通用選擇器

含義：匹配E元素后的所有符合條件的兄弟元素，不單單是緊鄰的兄弟元素。

偽類選擇器

E:link鏈接偽類選擇器

選擇器：E:link

含義：匹配所有未被點擊的鏈接。

E:visited鏈接偽類選擇器

選擇器：E:visited

含義：匹配所有已被點擊的鏈接。

E:active用戶行為偽類選擇器

選擇器：E:active

含義：匹配鼠標已經其上按下、還沒有釋放的E元素，常用于錨點和按鈕上。

E:hover用戶行為偽類選擇器 ()

選擇器：E:hover

含義：匹配鼠標懸停其上的E元素。

E:focus用戶行為偽類選擇器

選擇器：E:focus

含義：匹配獲得當前焦點的E元素。

E:target目標偽類選擇器

E:lang(en)語言偽類選擇器

E:checked選中狀態偽類選擇器

選擇器：E:checked

含義：匹配用戶界面上處于選中狀態的元素E。(用于input type為radio與checkbox時)。

示例：http://css.doyoe.com/selectors/pseudo-classes/checked.htm

E:enabled啟用狀態選擇器

E:disabled不可用狀態偽類選擇器

E:not(s)否定偽類選擇器

E:root文檔的根元素偽類選擇器

E:first-child偽類選擇器

E:last-child偽類選擇器

E:only-child偽類選擇器

E:nth-child(n)偽類選擇器

E:nth-last-child(n)偽類選擇器

E:first-of-type偽類選擇器

E:last-of-type偽類選擇器

E:only-of-type偽類選擇器

E:nth-of-type(n)偽類選擇器

E:nth-last-of-type(n)偽類選擇器

E:empty偽類選擇器

偽元素選擇器

E:first-letter | E::first-letter選擇器

E:first-line | E::first-line選擇器

E:before | E::before選擇器

E:after | E::after選擇器

選擇器：E:after | E::after

含義：設置在對象后(依據對象樹的邏輯結構)發生的內容。用來和content屬性一起使用，并且必須定義content屬性。

示例：http://css.doyoe.com/selectors/pseudo-element/after.htm

E::placeholder選擇器

E::selection選擇器

屬性選擇器

E[attr]屬性選擇器

E[att="val"]屬性選擇器

E[att~="val"]屬性選擇器

選擇器：E[att~="val"]

含義：選擇具有att屬性且屬性值為一用空格分隔的字詞列表，其中一個等于val的E元素。

示例：http://css.doyoe.com/selectors/attribute/att3.htm

E[att^="val"]屬性選擇器

選擇器：E[att^="val"]

含義：選擇具有att屬性且屬性值為以val開頭的字符串的E元素。

示例：http://css.doyoe.com/selectors/attribute/att4.htm

E[att$="val"]屬性選擇器

選擇器：E[att$="val"]

含義：選擇具有att屬性且屬性值為以val結尾的字符串的E元素。

示例：http://css.doyoe.com/selectors/attribute/att5.htm

E[att*="val"]屬性選擇器

選擇器：E[att*="val"]

含義：選擇具有att屬性且屬性值為包含val的字符串的E元素。

示例：http://css.doyoe.com/selectors/attribute/att6.htm

E[att|="val"]屬性選擇器

選擇器：E[att|="val"]

含義：選擇具有att屬性且屬性值為以val開頭并用連接符"-"分隔的字符串的E元素，如果屬性值僅為val，也將被選擇。

示例：http://css.doyoe.com/selectors/attribute/att7.htm

參考鏈接：

總結

以上是生活随笔為你收集整理的html5群组选择器,css选择器的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。