1.nth-of-type公式里的n是从0开始计算 2.nth-of-type获取到的元素,是从1开始计算 3.如果需要获取或排除前面的元素,用nth-of-type 如果需要获取或排除前面的元素,用nth-last-of-type 例子: 1.获取前三个:nth-of-type(-n+3),从n=0开始计算,分别得到第3,第2,第1个元素 2.获取前三个除外的:nth-of...
因为nth-of-type他是当前元素的兄弟元素的第n个,而nth-child是当前元素的兄弟节点的第n个当前元素,所以p:nth-of-type(4)是第四个p元素,只能是p元素的第四个,即 当前元素:nth-of-type无论中间加入什么元素,都只能是当前元素的第n个,而p:nth-child(4)是取第四个兄弟节点的p元素,所以我们发现第三个p被p...
:nth-child(n)选择器匹配属于其父元素下的第n个子元素,不论元素的类型。 :nth-of-type(n)结构性伪类选择器,匹配父元素下使用同种标签的第n项子元素,它的选择范围是父元素下某一种元素类型的集合。 例如: p:nth-child(2) 表示这个元素是p标签,并且是第二个子元素,两个条件必须满足 p:nth-of-type(2)...
ele:nth-of-type(n)的意义就是选择父元素下的第n个ele类型的子元素。 nth-child的关键词是child,它关心的是所有子元素。它会对所有子元素生效。ele:nth-child的意义就是选择父元素下的第n个子元素,如果他是ele类型的,那么对他生效,如果他不是ele类型的,则不生效。 简而言之,nth-child影响到了所有child子...
区别:两种匹配的元素不同,“:nth-of-type(n)”选择器是匹配属于父元素的特定类型的第N个子元素,元素类型是有限制的;而“:nth-child(n)”选择器是匹配属于其父元素的第N个子元素,元素类型是没有限制的。 1、:nth-child() 选择器 :nth-child(n) 选择器匹配属于其父元素的第 N 个子元素,不论元素的类型...
nth-of-type和nth-child的区别我这里就不说了,只说nth-of-type。 首先我们设定下面这样一个结构,然后通过下面四个例子真正理解nth-of-type 1.这是div 2.这是div.common 3.这是p.common 4.这是div.common 5.这是p.common 一、通过div标签选择第2个div div:...
nth-of-type选择器主要用于选取特定类型的子元素，且该子元素在同级同类元素中的位置符合指定的规律。
1 :nth-of-type(n) 是选择父元素的第n个同类型的子元素。 比如: .box>.item:nth-of-type(n) 选出的元素具有.item 并且在所有的.item兄弟元素中是第n位 2 :nth-child(n) 是选择父元素的第n个子元素 比如: .box>.item:nth-child(n) 选出的元素具有.item,并且在所有的兄弟元素中是第n位...
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)的...
其实.line:nth-of-type(2n+1) 是按照元素类型做个集合, 然后再根据不同的集合取符合奇数规则的显示。 这就解释了为何 p 和 div 都有显示。 而非揉在一起间隔显示。 tips: 注意 nth-of-type 的描述,相同兄弟节点的元素 .hello:nth-of-type(2n+1) ...