2018-9-7 seo達人
如果您想訂閱本博客內容，每天自動發到您的郵箱中， 請點這里
選擇器
學習目的 熟練使用 css 選擇器
css1 中的選擇器
E #myid id選擇器
E .warning 類選擇器
E F 包含選擇器
E:link 定義超鏈接未被訪問
E：visited 定義超鏈接已經被訪問
E:actice 匹配被激活的元素
E：hover 鼠標經過的元素
E：focus 獲取焦點
E::first-line 元素第一行
E::first-letter 元素第一個字符
css2
* 通配選擇文檔中所有元素
E[foo] 包含foo屬性的元素
E[foo="bar"] 包含屬性foo值為bar的元素
CSS3 中的選擇器可替代 了解即可
E[foo~="bar"] 含有屬性foo值包括bar的元素例如 <a foo="bar bar1 bar2">link</a>
E[foo|="en"] 屬性值是一個“-”分割的 比如 en-us
E:first-child 父元素的第一個子元素
E：lang(fr) 匹配屬性，元素顯示內容為語言為 fr
E::before 在元素前面插入內容
E::after 在元素后面插入內容
E>F 子包含
E+E 相鄰兄弟選擇器 后面的兄弟
css3
E[foo^="bar"] 屬性foo的值開頭是bar
E[foo$="bar"] 屬性foo的值得結尾是bar
E[foo*="bar"] 屬性foo的值包含bar <a foo="abc_bar_as">link</a>
結構類選擇器
E:root 屬性文檔所在的根元素
E:nth-child(n) E元素第n個位置的子元素 n可以是 (1,2,3) 關鍵字(odd,even) 公式(2n,2n+3) 起始值為1
E:nth-last-child(n) 與上面的使用方法一樣 倒數的第N個位置的子元素
E:nth-of-type(n) 匹配父元素中與E相同的元素中的第n個元素
E:nth-last-of-type(n) 匹配父元素中與E相同的倒數第n個元素
E:last-child 選擇位于其父元素的最后一個位置，且匹配E的子元素
E:first-of-type 選擇在其父元素中匹配E的第一個同類型的子元素
E:last-of-type 選擇在其父元素中匹配E的最后一個同類型的子元素
E:only-child 選擇其父元素只包含一個子元素，且該子元素匹配E
E:only-of-type 選擇其父元素只包含一個同類型的子元素，且該子元素匹配E
E:empty 選擇匹配E的元素，且該元素不包含子節點，文本也是節點
E~F 通用兄弟選擇器
E:not(s) 否定偽類選擇器
藍藍設計( www.syprn.cn )是一家專注而深入的界面設計公司，為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務。