css 选择器 nth-child 系列和nth-of-type系列区别

nth-child是表示选择当前父元素下所有元素中的第几个元素，而nth-of-type则表示选择父元素某一个给定类型的第几个元素，

例如  选择p父元素下的第一个p元素，可以这么写：

parent>p:first-child 或者 parent>p:first-of-type，第一种写法在父元素下第一个元素为p时没有什么问题。但是在父元素下第一个元素不是p标签就会出现问题。例如第一个元素是span。那么第一种写法就取不到第一个p元素。而第二种则可以正常的获取父元素下的第一个p元素。由此可见。nth-child系列。是根据父元素整个来获取元素的。而nth-of-type则是根据父元素下的某个给定的类型来获取相应的元素的