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-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、. . . ...
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-child(1)`:选择第一个子元素。 - `:nth-child(2)`:选择第二个子元素。 - `:nth-child(odd)`:选择奇数位置的子元素。 - `:nth-child(even)`:选择偶数位置的子元素。 2.选择一定范围的子元素: - `:nth-child(n)`:选择所有子元素。 - `:nth-child(n+4)`:选择从第4个子元素开始的...
:nth-child(1)//选择第1个元素 2、选择奇数个元素 :nth-child(odd)或者:nth-child(2n-1) 3、选择偶数个元素 :nth-child(even)或者:nth-child(2n) 4、选择前10个元素 :nth-child(-n+10) 5、选择11-20个元素 :nth-child(-n+20):nth-child(n+11) ...
p:nth-child(2){ background:#ff0000; } 只选择第五个元素 li:nth-child(5){ color: green; } 要选择第一个元素,你可以使用:first-child,或者我相信你也可以改下上面的例子来实现。 选择除了前面的五个之外的所有元素 如果有超过10个元素,它将会选中超过5个。
:nth-last-child(n) 选择器匹配属于其元素的第 N 个子元素的每个元素,不论元素的类型,从最后一个子元素开始计数。 n 可以是数字、关键词或公式。 提示:请参阅 :nth-last-of-type() 选择器,该选择器选取父元素的第 N 个指定类型的子元素,从最后一个子元素开始计数。
首先,选择器有几种基本形式,包括选择第一项、第N项和最后一项。使用:first-child可选取列表中的第一个元素,例如:first-child。通过:nth-child(n)可选取列表中的第n个元素,其中n是具体的数字。例如:nth-child(2)选取第二项。利用:last-child可选取列表的最后一个元素,例如:last-child。接...
nth-child作用 nth-child(n) 选择器匹配属于其父元素的第 n 个子元素。 注意: 1. 第n个子元素的计数是从1开始,不是从0开始的 2.选择表达式中的字母n代表≥0的整数 奇/偶数 用even/odd分别代表偶数 / 奇数:span:nth-child(even) 或者 用2n/2n-1分别代表偶数/奇数: span:nth-child(2n) ...
nth-child是选择父元素下的子元素,下标从1开始 p:nth-child(3n + 0)表示选择p元素父元素下的第3,6,9...个子元素,如果要选中第一个元素,要写成:nth-child(1),同理:nth-child(3n + 1)就代表选中第1,4,7...个子元素。 这里需要注意的是p元素父元素的第一个子元素为h1标签,所以要想选中p元素父元...