我如何使用CSS3选择器选择除最后一个子之外的所有子?

例如,如果只获取最后一个子元素,则使用div:n -last-child(1)。


当前回答

要查找last中的元素,请使用

<style>
ul li:not(:last-child){ color:#a94442}  
</style>

其他回答

.nav-menu li:not(:last-child){
    // write some style here
}

这段代码应该将该样式应用于除最后一个子元素之外的所有元素

当IE9到来时,这将变得更容易。但是很多时候,你可以把问题切换到一个要求:first-child和样式元素的反面(IE7+)。

简单点:

你可以将你的样式应用到所有的div上,并使用:last-child重新初始化最后一个div:

例如在CSS中:

.yourclass{
    border: 1px solid blue;
}
.yourclass:last-child{
    border: 0;
}

或在SCSS:

.yourclass{
    border: 1px solid rgba(255, 255, 255, 1);
    &:last-child{
        border: 0;
    }
}

易于阅读/记忆 执行速度快 浏览器兼容(IE9+,因为它还是CSS3)

你可以对:last子伪类使用否定伪class:not()。引入CSS选择器Level 3后,它在IE8或以下版本中无法工作:

:not(:last-child) { /* styles */ }

要查找last中的元素,请使用

<style>
ul li:not(:last-child){ color:#a94442}  
</style>