可以使用 :nth-last-child 和 :nth-child 两个伪类一起组合实现。 例如: li:nth-last-child(-n+3):nth-child(3n+3) { /* 选取最后一个 nth-child 直到 n 可以被 3 整除的元素*/ background-color: yellow; } 上述代码中,我们使用了nth-last-child(-n+3)选取最后三个元素,然后再用nth-child(3n...
li:first-child{color:red} 2. last-child 选择列表中的最后一个标签 li:last-child{color:pink} 3.nth-child(n) 这里的n为数字,表示选择列表中的第n个标签 例如选择第三个标签 li:nth-child(3){color:pink} 4.nth-child(2n) 选择列表中的偶数,选中 2、4、6…… 个标签。 li:nth-child(2n){colo...
elem:nth-last-child(n)作用同上,不过是从后开始查找。 elem:last-child选中最后一个子元素。 elem:only-child如果elem是父元素下唯一的子元素,则选中之。 elem:nth-of-type(n)选择器匹配属于父元素的 特定类型(必须为标签类型,如 div、p、span) 的第 n 个子元素的每个元素。 elem:first-of-type选中父元...
CSS3 :nth-last-child() 选择器 规定属于其父元素的第二个子元素的每个 p 元素,从最后一个子元素开始计数: 代码语言:javascript 复制 p:nth-last-child(2){background:#ff0000;} p:last-child 等同于 p:nth-last-child(1) CSS3 :nth-last-of-type() 选择器 规定属于其父元素的第二个 p 元素的每...
1、first-child 选择列表中的第一个标签。 2、last-child 选择列表中的最后一个标签 3、nth-child(n) 选择列表中的第n个标签 4、nth-child(2n) 选择列表中的偶数标签 5、nth-child(2n-1) 选择列表中的奇数标签 6、nth-child(n+3) 选择列表中的标签从第3个开始到最后 ...
我们需要设计的通用类型工具需要满足重一个数组中取出最后一个元素来当我们的输出类型。本题和我们一开始...
nth-last-child(-n+3)选择的是容器中的最后3个元素,nth-child(3n+1)选择第(3n+1)个元素,也就是第一列的元素(因为每行展示3个元素,多以两种选择都合3有关),两者的交集恰好就是最后一行的第一个元素,也就是左下角的这个元素。但是最后一行的元素个数也并不确定,为了完整的匹配到其后的元素,我们使用通用...
一、选择列表中的偶数标签 :nth-child(2n) 二、选择列表中的奇数标签 :nth-child(2n-1) 三、选择从第6个开始的,直到最后:nth-child(n+6) 四、选择第1个到第6个 :nth-child(-n+6) 一、两者结合使用,可以限制选择某一个范围,选择第6个到第9个 :nth-child(n+6):nth-child(-n+9)...
li:nth-last-child(n + 3) { /* styles */ } 1. 2. 3. 从末端选择前三项,从第三项开始计算。 让我们仔细看看。首先,我们需要从末端计算三个项。这样一来,第三项实际上就是我们从末端开始计算的第一项。 图片 我们从第三项算起直到最后,这里是被选中的项: ...
css伪类选择器 nth-child( ) 使用 (-n+8) 选中第5个到第8个元素(包含5和8本身)4、奇数、偶数li:nth-child(odd)li:nth-child(even) 5、隔选择子元素li:nth-child(3n+1) 选择1,4,7,10... 6、范围高级用法nth-child(n+2):nth-child(odd):nth-child(-n+9) 选中的子元素是从第2位到第9位...