p:last-child 等同于 p:nth-last-child(1) CSS3 :nth-last-of-type() 选择器 规定属于其父元素的第二个 p 元素的每个 p,从最后一个子元素开始计数: 代码语言:javascript 复制 p:nth-last-of-type(2){background:#ff0000;} 对于:nth-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个标签,代码如下: li:nth...
nth-last-child(n+n)nth-last-child(n+n):选择倒数第 n 个之前的元素。 举例:倒数第三个及之前的元素字体设置为粗体,代码如下: 代码语言:javascript 复制 li:nth-last-child(n+3){font-weight:bold;} 上面的几种方法运行效果如下图: nth-last-child(3n)nth-last-child(3n):选择第 3、6、. . . ...
首先，选择器有几种基本形式，包括选择第一项、第N项和最后一项。使用:first-child可选取列表中的第一个元素，例如：first-child。通过:nth-child(n)可选取列表中的第n个元素，其中n是具体的数字。例如：nth-child(2)选取第二项。利用:last-child可选取列表的最后一个元素，例如：last-child。接下...
:nth-child() :nth-child() 选择器,该选择器选取父元素的第 N 个子元素,与类型无关。 一、选择列表中的偶数标签:nth-child(2n) 二、选择列表中的奇数标签 :nth-child(2n-1) 三、选择从第6个开始的,直到最后:nth-child(n+6) 四、选择第
1.选择前几个元素 【负方向范围】选择第1个到第6个 :nth-child(-n+6) 2.从第几个开始选择 【正方向范围】选择从第6个开始的,直到最后 :nth-child(n+6) 3.两者结合使用,可以限制选择某一个范围 【限制范围】选择第6个到第9个,取两者的交集 ...
:nth-last-child(n) 选择器匹配属于其元素的第 N 个子元素的每个元素,不论元素的类型,从最后一个子元素开始计数。 n 可以是数字、关键词或公式。 提示:请参阅 :nth-last-of-type() 选择器,该选择器选取父元素的第 N 个指定类型的子元素,从最后一个子元素开始计数。
注:E:nth-child(n)选择器匹配父元素中的第n个子元素E(是第n个子元素且是E元素才生效)。 n可以是一个数字,一个关键字,或者一个公式。 nth-child(n)用法: 1、nth-child(3) 表示选择列表中的第3个标签,代码如下: li:nth-child(3){background:#fff} ...
“:nth-last-child(n)”选择器和前面的“:nth-child(n)”选择器非常的相似,只是这里多了一个“last”,所起的作用和“:nth-child(n)”选择器有所区别,从某父元素的最后一个子元素开始计算,来选择特定的元素。 (五)first-of-type选择器 “:first-of-type”选择器类似于“:first-child”选择器,不同之处...
如需选择第1个到第6个子元素，使用:nth-child(-n+6)即可实现。更进一步，结合使用可以指定范围，例如选择第6个到第9个子元素，通过:nth-child(n+6):nth-child(-n+9)即可。如果需要选择属于其元素的第N个子元素，不论元素的类型，从最后一个子元素开始计数，可以使用:nth-last-child(n)。若...