前端技术学习之选择器（八）

九，:nth-of-type(n)

又一个of-type，看到这里应该就明白了，这个:nth-of-type(n)是对:nth-child(n)选择器的扩展，只计算父元素中指定的某种类型的子元素。当某个元素中的子元素不是同一种类型的子元素时，使用:nth-of-type(n)选择器来匹配父元素中特定类型的子元素就很方便了。

举例：设置偶数个段落背景色为橙色

代码例子：

属性选择器

.wrapper>p:nth-of-type(2){

background-color:orange;

}

我是一个Div元素

我是一个段落元素

我是一个Div元素

我是一个段落

我是一个Div元素

我是一个段落

我是一个Div元素

我是一个段落

我是一个Div元素

我是一个段落

我是一个Div元素

我是一个段落

我是一个Div元素

我是一个段落

我是一个Div元素

我是一个段落

运行效果：

注:nth-last-of-type(n)和:nth-of-type(n)选择器一样是选择父元素中指定的某种子元素类型，但它的起始方向是从最后一个子元素开始，使用方法同：nth-last-child(n)一样。