Maison > Article > interface Web > nth-child和:nth-of-type的区别
:nth-of-type为什么要叫:nth-of-type?因为它是以"type"来区分的。也就是说:ele:nth-of-type(n)是指父元素下第n个ele元素,
而ele:nth-child(n)是指父元素下第n个元素且这个元素为ele,若不是,则选择失败。
例:
1
2
.box p:nth-child(1){
color:red; //选择失败,因为.box下面的第一个子元素不是p
}
.box p:nth-child(2){
color:red; //选择的元素是 1
}
.box p:nth-child(3){
color:red; //选择的元素是 2
}
.box p:nth-of-type(1){
color:red; //选择的元素是 1
}