1、:nth-child(2)选取第几个标签,“2可以是你想要的数字” 2、:nth-child(n+4)选取大于等于4标签,“n”表示从整数,下同 3、:nth-child(-n+4)选取小于等于4标签 4、:nth-child(2n-1)选取奇数标签,2n-1可以是odd 5、:nth-child(2n)选取偶数标签,2n可以是even 6、:nth-child(3n+1)自定义选取标签...
:nth-child(notation) 是 CSS3 规范中新增的一个伪类选择器,用于选中符合 notaion 表达式的目标“子元素”。 该选择器左侧若有其他选择器,表示命中同时符合左侧条件以及 notation 的“子元素”,如:p:nth-child(n+2) 表示命中所有属于其父元素下顺序在第二位的 p 元素。 之前对于 notation 的原理一直不甚理解...
1、first-child first-child表示选择列表中的第一个标签。代码如下: li:first-child{background:#090} 上面的意思是,li 列表中的 第一个li模块的背景颜色。 2、last-child last-child表示选择列表中的最后一个标签,代码如下: li:last-child{background:#090} 3、nth-child(3) 表示选择列表中的第3个标签,...
某个元素:nth-of-type(n)这个CSS 伪类是针对具有一组兄弟节点的标签, 用 n 来筛选出在一组兄弟节点的位置。 某个元素:nth-child(n)这个CSS 伪类首先找到所有当前元素的兄弟元素,, 用 n 来筛选出在当前元素的兄弟元素节点的位置。 我们...
首先，选择器有几种基本形式，包括选择第一项、第N项和最后一项。使用:first-child可选取列表中的第一个元素，例如：first-child。通过:nth-child(n)可选取列表中的第n个元素，其中n是具体的数字。例如：nth-child(2)选取第二项。利用:last-child可选取列表的最后一个元素，例如：last-child。接...
nth-child 公式的一般形式为:nth-child(an+b),其中a和b为整数。这个公式的意思是选择父元素的第n个子元素,其中n是从0开始计数的。 例如,nth-child(2)选择父元素的第二个子元素,nth-child(3)选择父元素的第三个子元素,以此类推。 在这个公式中,a和b可以是任意整数,它们决定了选择的具体位置。如果a为0,...
2、:nth-child(n) 选择器 匹配属于其父元素的第 N 个子元素,不论元素的类型。 n 可以是数字、关键词或公式。 数字:最常见的使用方式,eg: :nth-child(1) 关键词: Odd 和 even 是可用于匹配下标是奇数或偶数的子元素的关键词(第一个子元素的下标是 1)。
nth-child(2n)/nth-child(2n + 1):偶数 / 奇数 nth-child(n + 3):第 3 个开始到最后 骚操作:限制选择范围 上面的用法中的第三部分,一般都是使用n,而有时候也会用到-n,比如选取前 2 个元素就是:nth-child(-n + 2)。 为什么是这样呢?其实运算:-n + 2 ≥ 0,就可以推出n ≤ 2。
- `:nth-child(1)`:选择第一个子元素。 - `:nth-child(2)`:选择第二个子元素。 - `:nth-child(odd)`:选择奇数位置的子元素。 - `:nth-child(even)`:选择偶数位置的子元素。 2.选择一定范围的子元素: - `:nth-child(n)`:选择所有子元素。 - `:nth-child(n+4)`:选择从第4个子元素开始的...
n可以是一个数字,一个关键字,或者一个公式。 nth-child(n)用法: 1、nth-child(3) 表示选择列表中的第3个标签,代码如下: li:nth-child(3){background:#fff} 2、nth-child(2n) 表示选择列表中的偶数标签,即选择 第2、第4、第6…… 标签,代码如下: ...