0

これが私のコードの簡略化されたスニペットです:

<li id="work-5" class="work-5 class-B">
    <div>some other stuff</div>
    <div class="class-A"></div>
</li>
<li id="work-6" class="work-6 class-C">
    <div class="class-A"></div>
</li>

クラスBの要素のツリーの下にあるクラスAの要素にCSSスタイルを適用したいと思います。言い換えると、異なるクラスを持つ2つの異なる要素のツリーの下のどこかにある(必ずしも最初の子である必要はない)同じクラス(クラスA)を持つ2つの要素に異なるスタイルを適用したいと思います。これを実現するためにCSSセレクターを使用できますか?

4

4 に答える 4

6

基本的なCSS:

.class-B .class-A {
   ...
}
于 2012-04-10T03:25:03.083 に答える
0

2つのクラスセレクターと子孫コンビネーター!

.class-B .class-A {
    /* ... */
}
于 2012-04-10T03:25:30.830 に答える
0

確かにできます。親クラスを使用してターゲットにします。

http://jsfiddle.net/DpddQ/

.class-B .class-A { background: blue; color: white; }
.class-C .class-A { background: red; }
​
于 2012-04-10T03:25:46.227 に答える
0

はい、これには多くの選択肢があります。

#work-5 .class-A { }
#work-6 .class-A { }

また

.work-5 .class-A { }
.work-6 .class-A { }

また

#work-5.work-5 .class-A { }
#work-6.work-6 .class-A { }

また

#work-5.work-5.class-B .class-A { }
#work-6.work-6.class-C .class-A { }

ニーズにもよりますが、セレクターが具体的であるほど、優先順位が高くなります。

于 2012-04-10T03:25:47.723 に答える