li:nth-child(2n-1){color:pink} 6.选择从第4个到最后一个标签,这个4可以提换成你需要的数字 li:nth-child(n+4){color:pink} 7. 选择从第一个到第四个 这里的数字4也是可以根据你的需要替换的。 li:nth-child(-n+4){color:pink} 8.nth-last-child(3) 表示最后三个标签 li:nth-last-child(3)...
描述:表示周期的长度,n 是计数器(从 0 开始),b 是偏移值。 3、主要思路: 运用less混合传参,参数既是 :nth-child(n) 选择器的公式 在混合里面处理每个原色的底色,通过 :nth-child(n) 选择器结合 ::after 伪元素实现。 有了思路之后,下面让我们看一下具体的代码实现👇 4、代码实现 以下只贴颜色处理的...
1.序列选择器多用于列表,因为每个列表的列表项都是li元素 2.li:nth-child(n)表示的是选中li父元素中列表项第n个子元素是li的元素 3.li:nth-child(2n)表示的是选中li父元素中列表项偶数个子元素都是li的元素 4.li:nth-child(2n+1)表示的是选中li父元素中列表项奇数个子元素都是li的元素 5.li:nth-chi...
p:nth-child(n+2) 表示正向范围，从第2个 p 元素开始（包括第2个 p 元素）到最后一个 p 元素都添加背景色（这里范围指2-5）p:nth-child(-n+5) 表示负向范围，从最后一个 p 元素（包括最后一个元素）到第一个 p 元素都添加背景色（这里范围指5-1）
1、:nth-child()选择器:nth-child(n)选择器匹配属于其父元素的第N个子元素,不论元素的类型,n可以是数字、关键词或公式。 2、:nth-of-type(n) :nth-of-type(n)选择器匹配属于父元素的特定类型的第N个子元素的每个元素,n可以是数字、关键词或公式。 3、具体区别首先看代码 p:nth-of-type(7)选择的p...
nth-child(n):选择所有子元素,n从 1 开始计数。 nth-child(odd):选择所有奇数位置的子元素。 nth-child(even):选择所有偶数位置的子元素。 nth-child(an+b):选择从第b个开始,每隔a-1个元素选择一个。 应用场景 斑马条纹效果:通过给奇数行和偶数行设置不同的背景色,实现表格或列表的斑马条纹效果。
表示给3的倍数的p元素添加背景色,2n就是2的倍数,4n就是4的倍数,以此类推 p:nth-child(odd) 表示给所有奇数p元素添加背景色 p:nth-child(even) 表示给所有偶数p元素添加背景色 使用公式 (an + b),描述:表示周期的长度,n 是计数器(从 0 开始),b 是偏移值 ...
4、nth-child(2n) 这个表示选择列表中的偶数标签,即选择 第2、第4、第6…… 标签。 5、nth-child(2n-1) 这个表示选择列表中的奇数标签,即选择 第1、第3、第5、第7……标签。 6、nth-child(n+3) 这个表示选择列表中的标签从第3个开始到最后。
因为nth-of-type他是当前元素的兄弟元素的第n个,而nth-child是当前元素的兄弟节点的第n个当前元素,所以p:nth-of-type(4)是第四个p元素,只能是p元素的第四个,即 当前元素:nth-of-type无论中间加入什么元素,都只能是当前元素的第n个,而p:nth-child(4)是取第四个兄弟节点的p元素,所以我们发现第三个p被...
1.1.4 新增该选择器。 AI检测代码解析 // 这里的selector表示具体的选择器 // 这里的n表示具体的序号或者符合要求的表达式 jQuery( "selector:nth-child(n)" ) 1. 2. 3. 参数 n一般是一个自然数,表示作为父元素下的第n个子元素。例如::nth-child(2)表示作为父元素的第2个子元素。n也可以为特定的表...