css - クラス a を使用するがクラス b を使用しない CSS セレクター

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

選択したものを使用してCSS3でこれを行うことができると思います:not()（例はこちら）

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 疑似クラスの場合:

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