1.first-child 选择列表中的第一个标签 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...
first-childfirst-child:选择列表中的第一个标签。 举例:第一行字体显示为红色,代码如下: 代码语言:javascript 复制 li:first-child{color:red;} last-childlast-child:选择列表中的最后一个标签。 举例,最后一行字体显示为绿色,代码如下: 代码语言:javascript 复制 li:last-child{color:green;} nth-child(n)nth...
一、偶数: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) :nth-last-child() 选择器 :nth-last-child(n) 选...
若需从第6个开始选择，直至最后一个子元素，使用:nth-child(n+6)即可。如需选择第1个到第6个子元素，使用:nth-child(-n+6)即可实现。更进一步，结合使用可以指定范围，例如选择第6个到第9个子元素，通过:nth-child(n+6):nth-child(-n+9)即可。如果需要选择属于其元素的第N个子元素，不论...
last-child last-child：选择列表中的最后一个标签。还有就是偶数选择：nth-child(even) nth-chi...
规定属于其父元素的第二个子元素的每个 p 元素,从最后一个子元素开始计数: 代码语言:javascript 复制 p:nth-last-child(2){background:#ff0000;} p:last-child 等同于 p:nth-last-child(1) CSS3 :nth-last-of-type() 选择器 规定属于其父元素的第二个 p 元素的每个 p,从最后一个子元素开始计数: ...
首先，选择器有几种基本形式，包括选择第一项、第N项和最后一项。使用:first-child可选取列表中的第一个元素，例如：first-child。通过:nth-child(n)可选取列表中的第n个元素，其中n是具体的数字。例如：nth-child(2)选取第二项。利用:last-child可选取列表的最后一个元素，例如：last-child。接...
-n+4)选取⼩于等于4标签 4、:nth-child(2n-1)选取奇数标签，2n-1可以是odd 5、:nth-child(2n)选取偶数标签，2n可以是even 6、:nth-child(3n+1)⾃定义选取标签，3n+1表⽰“隔⼆取⼀”7、:last-child选取最后⼀个标签 8、:nth-last-child(3)选取倒数第⼏个标签,3表⽰选取第3个 ...
case-2展示了如何选择第二子节点。case-3和case-4分别展示了使用n取值从0到无穷大，元素检索的下标从1开始的原理。case-5进一步展示了如何根据n值筛选特定位置的子节点。在case-6中，我们利用nth-last-child(n)选择最后一个子节点。最后，case-7展示了如何选择倒数第二个子节点，通过n值的应用，...
li:nth-last-child(3){background:#fff} first-child用法: 1、first-child first-child表示选择列表中的第一个标签。代码如下: li:first-child{background:#fff} last-child用法: 1、last-child last-child表示选择列表中的最后一个标签,代码如下: li:last-child{background:#fff}...