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...
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-last-child(n)nth-last-child(n):选择倒数第 n 个元素。 举例:倒数第三元素字体设置为红色,代码如下: 代码语言:javascript 代码运行次数:0 运行 AI代码解释 li:nth-last-child(3){color:red;} 同样可以使用上面的方法进行拓展,方法如下: nth-last-child(n+n)nth-last-child(n+n):选择倒数第 n 个...
:nth-last-child(n) 选择器匹配属于其元素的第 N 个子元素的每个元素,不论元素的类型,从最后一个子元素开始计数。n可以是一个数字,一个关键字,或者一个公式。提示: 请参阅 :nth-last-of-type() 选择器。该选择器匹配父元素中的倒数第n个结构子元素。
:nth-child :nth-last-child 和 :last-child :nth-child(n) 选择器匹配属于其父元素的第 N 个子元素,不论元素的类型。 n可以是数字、关键词或公式。 p:nth-child(2) 可以理解为:如果 p 的父元素的第2个子元素是 p,那么为这个 p 单独设置样式...
nth-child(n)、first-child、last-child用法 nth-child(n)、first-child、last-child⽤法注:E:nth-child(n)选择器匹配⽗元素中的第n个⼦元素E(是第n个⼦元素且是E元素才⽣效)。n可以是⼀个数字,⼀个关键字,或者⼀个公式。nth-child(n)⽤法:1、nth-child(3)表⽰选择列表中的...
li:nth-last-child(n+3){/* styles */} 从末端选择前三项,从第三项开始计算。 让我们仔细看看。首先,我们需要从末端计算三个项。这样一来,第三项实际上就是我们从末端开始计算的第一项。 我们从第三项算起直到最后,这里是被选中的项: CSS中的数量查询限制 ...
li:nth-last-child(-n+4){color:green;} 相应的,这里正则需要用到零宽正向先行断言(?=pattern)。如果要匹配后4个字符,就表示后面有0到3个字符的那个字符: "0123456789".replace(/.(?=.{0,3}$)/g,"*");// "012345***" 7、匹配奇数位 CSS...
1、first-child first-child表示选择列表中的第一个标签。代码如下: li:first-child{background:#090} 上面的意思是,li 列表中的 第一个li模块的背景颜色。 2、last-child last-child表示选择列表中的最后一个标签,代码如下: li:last-child{background:#090} ...
一、E:nth-child 和 E:nth-last-child 1.E:nth-child(n) E:nth-child(n)选择器用来定位某个父元素的一个或多个特定的子元素。其中“n”是其参数,而且可以是整数值(2,4,6),也可以是表达式(n+1、-n+5)和关键词(odd、even),但参数n的起始值始终是1,而不是0。也就是说,参数n的值为0时,选择器...