css3偽類(lèi)選擇器有哪些
在CSS3中,類(lèi)選偽類(lèi)選擇器是擇器用于選取DOM樹(shù)之(zhi)外的元素,或者是類(lèi)選不能被常規CSS選擇器選取的元素,它們以冒號??(:)開(kāi)頭,擇器ヽ(′ー`)ノ后面跟著(zhù)一個(gè)或多個(gè)標準或者自??定義的類(lèi)選關(guān)鍵字,以下是擇器一些主要的CSS3偽類(lèi)選擇器:
(圖片來(lái)源網(wǎng)絡(luò ),侵刪)??1、類(lèi)選:firstchild
這個(gè)偽類(lèi)選擇器匹配父元素的擇器首個(gè)子元素。
2、類(lèi)選:lastchild
這個(gè)偽類(lèi)選擇器匹配父元素的擇器最后一個(gè)子元素。
這個(gè)偽類(lèi)選擇器匹配父元素的擇器第n個(gè)子元素。:nthchild(2)將匹配第二個(gè)子元素,類(lèi)選:nthchild(odd)將匹配所有的擇器奇數位置的子元素。
4、類(lèi)選:firstoftype
這個(gè)偽類(lèi)選擇器匹配父元素的首個(gè)特定類(lèi)型的子元素。
5、:lastoftyp??e
這個(gè)偽類(lèi)選擇器匹配父元素的最后一個(gè)特定類(lèi)型(′▽?zhuān)?的子元素。
這個(gè)偽類(lèi)選擇器匹配父元素的第n個(gè)特定類(lèi)型的子元素。
7、:onlychild
這個(gè)偽類(lèi)選擇器匹配父元(╯‵□′)╯素只有一個(gè)子元素時(shí)的那個(gè)子元素。
8、:onlyoftype
9、:??empty
這個(gè)偽類(lèi)選擇器匹配沒(méi)有子元素的元素。
10、:target
這個(gè)偽類(lèi)選擇器匹配當前活動(dòng)的鏈接(點(diǎn)擊的鏈接)。
11、:not(selector)
這個(gè)偽類(lèi)選擇器匹配不符合括號內選擇器條件的元素。
12、:checked=""
這個(gè)偽類(lèi)選擇器匹配被選中的i??nput元素。
13、:enabl(′;д;`)ed
14、:disab??led
15、:root
這個(gè)偽類(lèi)選擇器匹配文檔的??根元素。
16、:(//ω//)nthlastchild(n)
這個(gè)偽類(lèi)選擇器匹配父元素的倒數第n個(gè)子元素。
17、:nthlastoftype(n)
這個(gè)偽類(lèi)選擇器匹(′▽?zhuān)?配父元素的倒數第n個(gè)特定類(lèi)型的(de)子元素。
18、:lang(language)
這個(gè)偽類(lèi)選擇器匹配指定語(yǔ)言的內容。
19、:right
這個(gè)偽類(lèi)選擇器匹配在右對齊的文本。
2ヽ(′▽?zhuān)?ノ0、:left
這個(gè)偽類(lèi)選擇器匹配在左對齊的文本。
21、:placeholdershown
這個(gè)偽類(lèi)選擇器匹配當前顯示占位符的輸入框。
以上就是CSS3中的主要(yao)偽類(lèi)選擇器,它們提供了強大的功能,使我們能夠更靈活地控制頁(yè)面的樣式和布局。
FAQs:
Q1: CSS3中的:firstchild和:firstoftype有什么區別?
Q2: CSS3中的:nthchild(n)和:n(T_T)thoftype(n)有什么不同?
A2: :nthchild(n)匹配的是父元素的(?⊿?)第n個(gè)子??元素,無(wú)論該子元素的類(lèi)型是什么;ヾ(′?`)?而:(╯°□°)╯nthoftype(n)匹配??的是父元素的第n個(gè)特定類(lèi)型的子元素,只有當該子元素的類(lèi)型與指定的類(lèi)型相匹配時(shí)才會(huì )被選中。
