nth-of-type选择器主要用于选取特定类型的子元素,且该子元素在同级同类元素中的位置符合指定的规律。例...
所以p:nth-of-type(4)是第四个p元素,只能是p元素的第四个,即 当前元素:nth-of-type无论中间加入什么元素,都只能是当前元素的第n个,而p:nth-child(4)是取第四个兄弟节点的p元素,所以我们发现第三个p被p:nth-child(4)取到啦。
nth-of-type的用法 nth-of-type的⽤法 nth-of-type是css3的⼀个结构性伪类选择器,很多⼈都知道nth-of-type(n)⽤于匹配⽗元素下使⽤同种标签的第n项⼦元素,但是也有不少⼈对这个选择器存在着⼀些误解。如果采⽤标签+nth-of-type(1)的写法,他就会寻找⽗标签下第⼀个该标签,如果是...
:nth-of-type(n)选择器实例代码 如下实例代码,通过类class属性值为c的选择器匹配选择元素,这些元素指向的父元素为一个div元素,然后通过:nth-of-type(1)选择器选择该div中第一个类型class为c的子元素,因为下方实例中,class为c的div和class为c的段落p都是各自div和p元素集合中的第一个元素,因此都会被选择: 代...
:nth-of-type()是jQuery中的内置选择器,用于选择指定父级的所有nth-child元素。 用法: parent_name:nth-of-type(n|even|odd|algebric equation) 参数:它需要一个参数(n|even|odd|algebric equation) 值描述 n选择第n个索引处的子项(从1开始)。 n必须为整数。
:nth-of-type(n)选择器匹配同类型中的第n个同级兄弟元素。 n可以是一个数字,一个关键字,或者一个公式。 $(document).ready(function() { var lx=getUrlParams('lx'); debugger var $wrapper = $('.sdk'), $allTabs = $wrapper.find('.tab-content > div'), ...
CSS中 :nth-of-type()选择器的用法?请参考以下内容:工具/原料 计算机 :nth-of-type()方法/步骤 1 :nth-of-type()伪类选择器初识 2 新建一个HTML文档 3 使用nth-of-type(n)选择器,请细看注释 4 保存文件,在浏览器查看输出结果 5 :nth-of-type(n)的使用总结 注意事项 理解:nth-of-type(n)的...
#app .dialog:nth-child(3)但是感觉这个方法不太灵活,毕竟是获取的#app元素下所有的.dialog元素,然后通过nth-child再去拿到对应的元素。如果#app里面的子节点,孙节点等都含有这个dialog元素的话,那么必须要对页面结构非常的熟悉才能通过nth-child这个伪类去获取元素。
可以看出nth-child是根据元素的个数来计算的,尽管我们在:nth-child前面加了p。这个没啥好说的,但nth-of-type要是不研究一下还真容易理解错,它说的是按照类型来选择,看下面这个例子。 p:nth-of-type(1),p:nth-of-type(3){ color:red; } 标题...
用法: element:nth-last-of-type(n|even|odd|formula) 参数: n:它从最后选择第n个元素。 even:它从最后选择每个偶数元素。 odd:它从最后选择每个奇数元素。 formula:它包含从最后开始生成元素分组的公式,例如:3n + 2通过取值n-0、1、2,...来选择此表达式输出的每个元素。