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则是根据父元素下的某个给定的类型来获取相应的元素的

posted @ 2017-08-11 12:03  于啊  阅读(405)  评论(0)    收藏  举报