:nth-of-type(n)选择器实例代码 如下实例代码,通过类class属性值为c的选择器匹配选择元素,这些元素指向的父元素为一个div元素,然后通过:nth-of-type(1)选择器选择该div中第一个类型class为c的子元素,因为下方实例中,class为c的div和class为c的段落p都是各自div和p元素集合中的第一个元素,因此都会被选择: 代...
nth-child是从父元素下不分类型统一排序,先选中第n个子元素,再看看是不是对应的类(或标签); nth-of-type从父元素下先按照类名(或标签)分别排序,再选择每一排序中的第n个子元素。
所以p:nth-of-type(4)是第四个p元素,只能是p元素的第四个,即 当前元素:nth-of-type无论中间加入什么元素,都只能是当前元素的第n个,而p:nth-child(4)是取第四个兄弟节点的p元素,所以我们发现第三个p被p:nth-child(4)取到啦。
classA:nth-of-type(n) classA的父元素的子元素中,每种类型的元素节点中第n个classA匹配(不一定是classA的父元素的第n个子元素,也不一定是只有一个) classA:nth-child(n) classA元素的父元素的第n个子元素且是classA元素才匹配 p{color:blue;}.type:nth-of-type(1){background-color:red;}/*.type...
在以上八个伪类选择器中,:first-child:last-child:nth-child(n):nth-last-child(n)在选择元素时,是按照其所有类型的兄弟元素开始计数,而:first-of-type:last-of-type:nth-of-type(n)nth-last-of-type(n),是按照其兄弟元素中,忽略除该元素以外的所有其他元素后开始计数的。
nth-of-type(n)的语法,这里假设selector是一个元素p选择器,如此,:nth-of-type(n)可以用于匹配p元素选择器选择到的p元素指向的父元素中第n个类型为p的子元素,而且与p是否是该父元素的第n个子元素无关,比如父元素有3个子元素,分别是p、span和p,那么:nth-of-type(2)选择到的是第二个p元素,而不是第二...
CSS3 :nth-of-type() Selector 完整CSS选择器参考手册 实例 指定每个p元素匹配同类型中的第2个同级兄弟元素的背景色: p:nth-of-type(2) { background:#ff0000; } 尝试一下 » 定义和用法 :nth-of-type(n)选择器匹配同类型中的第n个同级兄弟元素。
nth-of-type的⽤法 nth-of-type是css3的⼀个结构性伪类选择器,很多⼈都知道nth-of-type(n)⽤于匹配⽗元素下使⽤同种标签的第n项⼦元素,但是也有不少⼈对这个选择器存在着⼀些误解。如果采⽤标签+nth-of-type(1)的写法,他就会寻找⽗标签下第⼀个该标签,如果是类名+nth-of-type(...
nth-of-type(n)选择器和“:nth-child(n)”选择器非常类似,不同的是它只计算父元素中指定的某种类型的子元素。当某个元素中的子元素不单单是同一种类型的子元素时,使用“:nth-of-type(n)”选择器来定位于父元素中某种类型的子元素是非常方便和有用的。
jQuery :nth-of-type() 选择器 :nth-of-type()是jQuery内置的一个选择器,用于选择所有指定父元素的第n个子元素。 语法: parent_name : nth-of-type(n|even|odd|algebraic equation) 参数:它需要一个参数n|even|odd|代数方程。 Value 说明 n 选择存