CSS選擇器有哪些

這篇文章將為大家詳細(xì)講解有關(guān)CSS選擇器有哪些，小編覺(jué)得挺實(shí)用的，因此分享給大家做個(gè)參考，希望大家閱讀完這篇文章后可以有所收獲。

復(fù)合選擇器

并集選擇器:多個(gè)類型選擇器,中間用逗號(hào)隔開(kāi) div,span,p{} 為了讓多個(gè)選擇器設(shè)置同一個(gè)樣式。

后代選擇器: ul li{} ul中的所有li都會(huì)設(shè)置樣式,包含li中的子元素ul中的li。也就是ul1的孫元素。

直接后代選擇器:ul>li{} 只管父類后邊的子類li,不管子類后邊的子類ul中的li。

偽選擇器

偽元素選擇器:配合選擇器使用

1.first-line選擇器

2.first-letter選擇器

3.before{ content: ""}(前邊加文字)

4.after{content:""}

偽類選擇器:根據(jù)元素位置選擇元素 比如ul中的li的位置

nth-child選擇器:根據(jù)索引元素位置判斷,從1開(kāi)始

子元素選擇器:

1.nth-child(n):選擇元素的第n個(gè)元素作為選擇器。

n=odd 奇數(shù); n=even 偶數(shù)

2.nth-last-child(n):倒數(shù)索引

first-child: ul li:first-child{}

last-child: ul li:last-child{}

動(dòng)態(tài)偽類選擇器

1.(:link):指定鏈接未被點(diǎn)擊時(shí)的樣式

2.vistited:鏈接被訪問(wèn)之后的效果。一般由于瀏覽器緩存會(huì)顯示錯(cuò)誤

3.hover:鼠標(biāo)懸停時(shí)候的樣式

4.active:用戶點(diǎn)擊時(shí)候的樣式

5.focus:獲得聚焦時(shí)候的樣式

補(bǔ)充:

CSS對(duì)大小寫(xiě)不嚴(yán)格要求,但是還是要書(shū)寫(xiě)規(guī)范。

權(quán)值大小比較:

內(nèi)聯(lián)樣式表的權(quán)值為 1000

ID 選擇器的權(quán)值為 1000

Class 類選擇器的權(quán)值為 10

HTML 標(biāo)簽選擇器的權(quán)值為 1

優(yōu)先級(jí)：important>內(nèi)聯(lián)樣式>id>class>標(biāo)簽|偽類|屬性選擇器>偽元素>通配符（*）>繼承

關(guān)于“CSS選擇器有哪些”這篇文章就分享到這里了，希望以上內(nèi)容可以對(duì)大家有一定的幫助，使各位可以學(xué)到更多知識(shí)，如果覺(jué)得文章不錯(cuò)，請(qǐng)把它分享出去讓更多的人看到。