CSS怎么选择除了第一个子元素外的其余同级子元素

2023-11-12  本文已影响0人  码字的程序员

使用 CSS 的:not()伪类选择器和:nth-child()伪类选择器

要通过CSS的代码选择某一个元素的除了第一个子元素外的其余的跟第一个子元素同级的子元素,可以结合使用CSS的:not()伪类选择器和:nth-child()伪类选择器进行选择。大致的语法如下:

.parent > .child:not(:nth-child(1)) {样式设置}

CSS选择除了第一个子元素外同级子元素实例代码

下面除了使用上述的两种伪类选择器之外,还结合了class属性:

<div class='p'>
  <div class='c'>p的第一个子元素</div>
  <div class='c'>p的第二个子元素</div>
  <div class='c'>p的第三个子元素</div>
</div>


<style>
  .p > .c:not(:nth-child(1)){color:green;}
</style>

原文及在线编辑器:CSS怎么选择除了第一个子元素外的其余同级子元素

上一篇 下一篇

猜你喜欢

热点阅读