有可能链:not()then:last-child？

Question

我需要设置样式(仅限CSS)最后一个子元素,同时排除具有特定类的元素.

例如,我想要风格

<ul>
  <li>Bar</li>
  <li>Bar</li>
  <li>Bar</li>
  <li>Should have a green background</li>
  <li class='foo'>Bar</li>
</ul>

没有类'foo'的最后一个li应该是绿色的.我试过了

li:not(.foo):last-child {
    background-color: green;
}?

要么

li:not(.foo):last-of-type {
    background-color: green;
}?

但它不起作用.

见http://jsfiddle.net/gentooboontoo/V7rab/2/

Answer 1

在回答你的问题是否有可能链:not(),然后:last-child?(或者更简单地说,可以伪类被链接？)是一个很有肯定.但正如其他人所指出的那样,如果一个人li:last-child有一个,id="foo"那么就不会选择任何东西.作为一个示范,一个类似的表达

li:not(.bar):last-child {
    background-color: green;
}?

工作得很好.问题是连续的选择器都适用于整个上下文,而不是前面表达式指定的子集,因此它们li:not(.foo):last-child是相同的li:last-child:not(.foo),这显然不是所需要的.

Answer 2

我不认为这会起作用(它不起作用,但我不认为它应该工作)

选择器正在工作,但倒数第二个li永远不会是:last-child因为它不是最后一个孩子......

它不像jQuery的not()方法实际上从选择中删除指定的元素.CSS :not选择器/过滤器将忽略该元素,但不会将其从页面中删除