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){color:pink} 9.nth-last-child(3n) 表示3的倍数3.6.9…… li:nth-last-child(3n){color:pin...
:nth-child(3n+1)自定义选取标签,3n+1表示“隔二取一” .demo01 li:nth-child(3n+1){background:#090} :last-child选取最后一个标签 .demo01 li:last-child{background:#090} :nth-last-child(3)选取倒数第几个标签,3表示选取第3个 .demo01 li:nth-last-child(3){background:#090} Odd 和 even...
热衷技术，在编程路上越走越远～ 知识运用： 条件类型的使用：文档地址 infer关键字也参照条件类型使用...
first-child选择器可以用来选择父元素的第一个子元素并应用样式。例如,在一个无序列表中,我们想要为第一个列表项添加特定样式,可以使用以下代码: ul li:first-child { /* 样式代码 */ } 这段代码会选择ul元素中第一个li元素并应用样式。 last-child选择器 last-child选择器可以用来选择父元素的最后一个子元素...
除了nth-child选择器,还有其他的nth选择器可以用来选择不同类型的元素,比如nth-of-type选择器用于选择某一类型的元素中的特定位置元素。 nth选择器非常灵活,我们可以通过组合nth选择器与其他选择器来实现更加精确的元素选择。比如我们可以使用nth选择器来选择每行的第一个或者最后一个元素。 总之,nth选择器是CSS中非常...
同样地,如果我们想选择一个父元素下的偶数个子元素,我们可以使用:nth-child(even)。 除了基本语法外,nth-child(n)还支持一些高级用法。例如,我们可以使用:nth-child(3n+1)来选择每隔3个子元素中的第1个子元素。这对于创建网格布局非常有用。 此外,在SCSS中还有一些其他与nth-child(n)相关的函数和混合宏可供...
对于p:nth-child(2)，如果它是一个段落，它将选择其父元素的第二个元素，而p:nth-of-type(2)将...
3、最后看该子元素是不是1中的伪类调用者,如果是,则应用css,否则不应用 ---》有时候first-child或者nth-child(1) 不起作用的原因 代码语言:javascript 复制 /*此时first-child不起作用,是因为.tap_con的父元素win的第一个子元素是.top,此时找到第一个子元素,但是其并不是.tab_con*/===.tab_con:first-...
:nth-last-child()选择器和前面的:nth-child()很相似,只是这里多了一个last,所以他起的作用就和前面的":nth-child"不一样了,他只要是从最后一个元素开始算,来选择特定元素。 例子: li:nth-last-child(4) {background: red;}/*把倒数第4个li的背景设为红色*/ ...
在CSS中，:last-child选择器用于匹配元素集合中的最后一个元素。在正则表达式中，通过结尾位置匹配符$来匹配最后一个字符。4、匹配第四个元素 在CSS中，使用:nth-child(4)选择器可以匹配特定位置的元素。在正则表达式中，通过零宽正向后行断言(?<=pattern)来匹配特定位置的字符。5、匹配前四个元素 在...