:nth-child()選擇器,選擇器選取父元素的第 N 個子元素,與類型無關。
:nth-child(n)
選擇器匹配屬於其父元素的第 N 個子元素,不論元素的類型。n 可以是數字、關鍵詞或公式。
:nth-child (an + b)
描述:表示周期的長度,n 是計數器(從 0 開始),b 是偏移值。
與之相似的選擇器有 :nth-of-type(n) 選擇器匹配屬於父元素的特定類型的第 N 個子元素的每個元素。用法和:nth-child()相同。
例如 :p:nth-of-type(3) 選取類型p的第3個子元素。
利用:nth-child()選擇器可以選擇相應的標簽進行樣式添加,可以不用給標簽添加ID和Class,以下是常用的例子:
1、:nth-child(5) 選取第五個標簽
2、:nth-child(n+3) 選取大於等於3的標簽
3、:nth-child(-n+3) 選取小於等於3的標簽
4、:nth-child(2n) 選取偶數標簽,等同於:nth-child(even)
5、:nth-child(2n-1) 選取奇數標簽,等同於:nth-child(odd)
6、:nth-child(3n+1) 每隔兩個元素選取一個
7、:last-child 選取倒數第一個
8、:nth-last-child(3) 選取倒數第三個