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...
nth-child(n + 2) 选择器从第2个子元素开始选择。 nth-child(-n + 5) 选择器从第1个子元素选择到第5个子元素。 组合使用时,会选中从第2个到第5个子元素。 3. li:nth-last-child(-n + 2) nth-last-child(-n + 2) 选择器从父元素的最后一个子元素向前数,选择倒数前两个子元素。 - end -...
first-childfirst-child:选择列表中的第一个标签。 举例:第一行字体显示为红色,代码如下: 代码语言:javascript 复制 li:first-child{color:red;} last-childlast-child:选择列表中的最后一个标签。 举例,最后一行字体显示为绿色,代码如下: 代码语言:javascript 复制 li:last-child{color:green;} nth-child(n)nth...
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-child() :nth-child() 选择器,该选择器选取父元素的第 N 个子元素,与类型无关。 一、选择列表中的偶数标签:nth-child(2n) 二、选择列表中的奇数标签 :nth-child(2n-1) 三、选择从第6个开始的,直到最后:nth-child(n+6) 四、选择第
:nth-child() :nth-child() 选择器,该选择器选取父元素的第 N 个子元素,与类型无关。 一、偶数:nth-child(2n) 二、奇数 :nth-child(2n-1) 三、第6个开始的,直到最后:nth-child(n+6) 四、选择第1个到第6个 :nth-child(-n+6) 五、两者结合使用,可以限制选择某一个范围,选择第6个到第9个 :...
css选择最后两个元素、奇数个,偶数个 要选择最后两个元素,可以使用:nth-last-child(-n+x)选择器。其中n表示元素总数,x表示最后几个元素的个数。 要选择奇数个元素,可以使用:nth-child(odd)选择器。 要选择偶数个元素,可以使用:nth-child(even)选择器。
...下面介绍它们的使用方法: first-child first-child:选择列表中的第一个标签。...举例:第一行字体显示为红色,代码如下: li:first-child{ color: red; } last-child last-child:选择列表中的最后一个标签。...举例,最后一行字体显示为绿色,代码如下: li:last-child{ color: green; } nth-child(...
在网站开发过程中,CSS选择器的“nth-child”属性提供了一种灵活的方式来选择特定位置或类型的元素。下面是一些常见的用法。首先,选择器有几种基本形式,包括选择第一项、第N项和最后一项。使用:first-child可选取列表中的第一个元素,例如:first-child。通过:nth-child(n)可选取列表中的第n个元素,...
若需从第6个开始选择,直至最后一个子元素,使用:nth-child(n+6)即可。如需选择第1个到第6个子元素,使用:nth-child(-n+6)即可实现。更进一步,结合使用可以指定范围,例如选择第6个到第9个子元素,通过:nth-child(n+6):nth-child(-n+9)即可。如果需要选择属于其元素的第N个子元素,不论...