Question

我尝试过各种各样的事情，但我觉得我变得过于复杂，甚至设法让我的选择器挂起来。我确定这是一个简单的方法

选择classa，但仅限于没有classb且忽略其最后一个实例

<div class="container">
    <div class="classa classb"></div> <!-- Dont Select -->
    <div class="classa"></div>  <!-- Select -->
    <div class="classa"></div>  <!-- Dont select last instance -->
</div>

Answer 1

我相信您可以使用选定的:not()（示例here）

使用CSS3执行此操作

div.classa:not(.classb):not(:last-child) {}

但是，如您所知，没有多少浏览器支持此功能，因此Javascript可能更容易...

Answer 2

.classa:not(.classb):not(:last-child) {
    /* rules */
}

在Firefox 12，Chrome 19，Safari 5和Opera 10上测试过。不幸的是它无效（猜猜是谁？）IE。

Answer 3

尝试：

.classa:not(.classb):first-child {
    background: red;
}

但这在IE 7或8中不起作用。

Answer 4

使用CSS3 pseudo classes：

.classa:not(:last-child):not(.classb) {
  // some rules...
}

带有类a而不是类b的CSS选择器

4 个答案: