CSS - nth pseudo selector

CSS - nth pseudo selector

nth-of-type v.s. nth-child的簡介

用法

classname:nth-of-type(num)
在class選擇器後面加上一個冒號後再使用

nth-of-type

在一堆同層級且同類的標籤中選取位在特定位置的同類標籤。注意,只會選取同類!

p:nth-of-type(num)
在一堆p中選取第num個

p:nth-of-type(odd)
p:nth-of-type(even)
在一堆p中選取位在偶數/奇數位的p

p:nth-of-type(a*n + b)
在一堆P中,每a個中,選取第b個

p:nth-of-type(3n + 1)
每3個中,選取第1個

:nth-last-of-type

用法跟nth-of-type類似,接收的參數也相同,只是他是從最後面數回來

p:nth-last-of-type(2)
選取倒數第二個

nth-child

在一堆同層級標籤中選取位在特定位置的,注意,不分類別,只要是同層級的標籤都可選。
用法跟nth-type差不多

Your browser is out-of-date!

Update your browser to view this website correctly. Update my browser now

×