nth of type與nth child的區別

nth-of-type：

簡單來說nth-of-type會忽略其它標籤的順序而按照標籤自身種類的順序進行篩選，也就是選擇的參照點並不是dom數，而是自身。下面我們結合具體的例子來了解下。

16     

7     這是乙個段落
8     
9     這是乙個段落
10     這是乙個段落
11     這是乙個段落
12     
**效果如下圖所示，文字中的第3個p標籤背景顏色發生改變。
它的屬性就是按照所有型別標籤的所謂整體佇列進行排序篩選，也就是說不論你是h1還是p標籤，使用這個屬性你要遵循在dom樹中的順序來進行操作。
16     

7     這是乙個段落
8     
9     這是乙個段落
10     這是乙個段落
11     這是乙個段落
如圖，第6個標籤的顏色發生改變
				
nth of type與nth child的區別
今天在看bootstrap教程的時候，發現教程上提到了乙個知識點是之前沒有注意過的，那便是nth of type和nth child。這兩個都是css3中的屬性。nth of child 它的屬性就是按照所有型別標籤的所謂整體佇列進行排序篩選，也就是說不論你是h1，span還是p標籤，使用這個屬性你...
				
nth of type和nth child的區別
nth of type n 選擇器匹配屬於父元素的特定型別的第 n 個子元素的每個元素.nth child n 選擇器匹配屬於其父元素的第 n 個子元素，不論元素的型別。html 這是標題h1 第乙個段落。p 第二個段落。p 第三個段落。p 第四個段落。p 第五個段落。p a css p nth o...
				
nth of type和nth child的區別
現在我在這個li中加了乙個a 如果你使用 nth child的時候 然後我們使用 li nth of type 2 的時候 因為它選擇的是li標籤的的第二個，只會找到li第二個，不管中間有多少別的內容。第乙個段落。第二個段落。第三個段落。第四個段落。第五個段落。第六個段落。第七個段落。第八個段落。第...