奇数时选择最后一个孩子,偶数时选择最后两个孩子

Question

我所处的元素数量是可变的,我需要一个我无法实现的奇怪解决方案,我甚至怀疑它是否只能用css实现.

如果我的元素数是奇数,我需要选择last-child,如果元素数是偶数,我需要选择最后2个子元素.

我一直试图用nth-last-child,:not(:nth-last-child())单双,但一直没有得到很好的解决.

任何人都有关于这个问题的任何想法/建议是在html表上添加类"奇怪"的一部分吗？

非常感谢提前!

Answer 1

这是一种方式......

.wrap div:last-child,
.wrap div:nth-last-of-type(-n+2):not(:nth-child(even)) {
    color: red;
}

<div class="wrap">
    <div>Odd</div>
    <div>Even</div>
    <div>Odd</div>
    <div>Even</div>
    <div>Odd</div>
    <div>Even</div>
</div>

<hr>

<div class="wrap">
    <div>Odd</div>
    <div>Even</div>
    <div>Odd</div>
    <div>Even</div>
    <div>Odd</div>
</div>

Answer 2

您可以像这样使用CSS:

li:last-child:nth-child(odd) {
    /* Last child AND odd */
    background: red;
}

li:nth-last-child(2):nth-child(odd),
li:last-child:nth-child(even) {
    /* Before last child AND odd */
    /* Last child AND even */
    background: green;
}

演示:https://jsfiddle.net/hw0ehrhy/