7

次のようなファイルがあります

<div>
 <div class="abc">
  <div>
   <!--some more divs inside-->
  </div>
 </div>
</div>

私がやりたいのは、最初の div だけにスタイルを適用することです。div:not(.abc, .abc *)、を使用しようとしましたがdiv:not(.abc):not(.abc *)、div:not(.abc), div:not(.abc) *どれも機能しませんでした。編集するファイルがたくさんあるので、html を編集するのは大変です。また、上記のコードは別の場所に表示されるため、>セレクターを使用することは解決策ではありません...誰かがこれを行う方法を知っていますか?

4

5 に答える 5

10

:not()要素やその子孫を除外するためにCSSのセレクターを確実に使用することはできません。その理由は、この回答（およびリンク先の他の回答）で説明されています。

コンビネータは使用できません。これはjQueryで機能しますが、CSSでは機能しません。

/* 
 * Grab everything that is neither #foo itself nor within #foo.
 * Notice the descendant combinator (the space) between #foo and *.
 */
:not(#foo, #foo *)

これは、主に適切な回避策がないため、特に厄介です。いくつかの緩い回避策（1および2）がありますが、それらは通常HTML構造に依存するため、有用性が非常に制限されています。

また、マークアップは予測できないため、編集したりセレクターを使用したりすることはできません。クラスをトップに適用してそのクラスを使用>する方法を見つける以外に、方法はあまりありません。上記のように、 Fluidbyteによって示され、および/またはjQueryを使用します。div

于 2012-06-03T13:21:57.137 に答える
1

通常、クラスを介して必要なものを含めてから、子孫要素を除外する方が簡単だと思います。ここでフィドルを参照してください：http://jsfiddle.net/cLtHg/

これにより、継承の問題が処理され、クロスブラウザー フレンドリーになります。

于 2012-06-03T13:09:14.193 に答える
0

HTMLに実際に触れていない場合、単純ですが汚いアプローチは、最初のdivにスタイルを適用してから、次のように後続のdivからスタイルを削除することです。

div {margin-bottom: 20px; border: 1px solid #ccc;}
div div {margin-bottom: 0; border: none;}

ここでの主な欠点は、子divの一部のスタイルが意図せずに削除される可能性があることです。そもそもどのようにスタイリングされているかによります。

于 2012-06-03T13:23:39.643 に答える
0

:first-child親要素の ID またはクラスと共に使用します。CSS を使用して要素をキャッチできない場合は、JavascriptまたはjQueryを使用することをお勧めします。

于 2012-06-03T13:05:20.383 に答える
0

試してみました:first-child か、または選択し:nth-child()ましたか？

于 2012-06-03T13:14:20.003 に答える