DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> WEB網站前端 >> WEB前端代碼 >> css選擇器詳細解析
css選擇器詳細解析
編輯:WEB前端代碼     
1、標簽選擇器 E{}

2、ID選擇器 #id{}

3、類選擇器.class{}

4、群組選擇器E1,E2,E3{}

5、後代選擇器E F{}

6、通配選擇器*{}

7、偽類選擇器E:Pseudo-elements{}


8、子選擇器E>F{}

9、臨近選擇器E+F{}

10、屬性選擇器E[attr]{}



選擇器的特殊性

  特殊性值表述為4個部分,如:0,0,0,0。

  一、對於選擇器中的ID屬性值,加0,1,0,0

  二、對於選擇器中的類屬性值,屬性選擇或偽類,加0,0,1,0

  三、對於選擇器中的各個元素和偽元素,加0,0,0,1

  四、結合符(+,>,~)和通配選擇器對特殊性沒有任何貢獻,加0,0,0,0

  五、行內樣式style="",加1,0,0,0

  六、!important,加1,0,0,0,0最高

css選擇器 +:相鄰選擇符,例如:x + y選擇緊跟x元素之後的第一個y元素。

css選擇器 ~:相鄰選擇符,例如:x ~ y選擇緊跟x元素之後的所有y元素。

css選擇器 >:子代選擇器,例如:x > y選擇作為x元素子元素的y元素。

h1{color:#f90;} /* 0,0,0,1 */
p em{color:#fff}/* 0,0,0,2 */
.title{color:#333;}/* 0, 0,1,0*/
*.author{color:#111;}/* 0,0,1,0 */
p.name span.sex{color:#f00;}/* 0,0,2,2 */
#ele{color:#00f;}/* 0,1,0,0 */
div#nav *[href] {color:#111;}/* 0,1,1,1 */

css偽元素:

  :first-line 向文本的首行添加特殊樣式,只能作用於塊元素。

  :first-letter 向文本的第一個字母添加特殊樣式,只能作用於塊元素。

  :before 在元素之前添加內容。

  :after 在元素之後添加內容



css偽類:

  :link 向未被訪問的鏈接添加樣式。

  :visited 向已被訪問的鏈接添加樣式。

  :hover 當鼠標懸浮在元素上方時,向元素添加樣式。

  :active 向被激活的元素添加樣式。

  :first-child 向元素的第一個子元素添加樣式。

  :focus 向擁有鍵盤輸入焦點的元素添加樣式。

  :lang 向帶有指定 lang 屬性的元素添加樣式。
XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved