CSSグラブすべてのクラス名最終

Question

のために、私はすべてのクラス名（」私のクラス 『）を取得し、それを変更したい場合を除きは、どうやら私は』 最後の1

ため除き赤の色ですグーグルでやっていて、クラスが終わったときなどはありません。 JSを使用せずにを回避しようとすると問題が発生します。

div1とdiv2は両方とも動的です！ div2が存在しない場合、div1は最初のp要素を赤で、2番目の要素は赤でなければなりません。

セレクタの一部ではないため、上部に「p」タグが残っていますのでご注意ください。私はちょうど '私のクラス'が特に必要です。

または私はネストされたPさん必要であれば私もそれを中に含まれて自由に感じるので、SASSを使用することができます

<p>Some text</p> 
<div class="my-container"> 
    <div class="div1"> 
    <p class="my-class"></p> 
    <p class="my-class"></p> 
    </div> 
    <div class="div2"> 
    <p class="my-class"></p> 
    <p class="my-class"></p> 
    <p class="my-class"></p> 
    <p class="my-class"></p> <!-- This tag should not be red--> 
    </div> 
</div> 

を含める私のコンテナのすべての「P」の内部をつかむために書くことができるセレクタがあります。

Answer 1

次の回避策を使用できます。

div:last-childを使用してください。それはcontainerの最後のdivを選択し、一つだけが存在する場合、それはそれを選択しますので...最後divから最後pが

.my-container div p.my-class { 
 
color:red; 
 
} 
 
.my-container div:last-child p.my-class:last-child { 
 
color:blue; 
 
}

<p>Some text</p> 
 
<div class="my-container"> 
 
    <div class="div1"> 
 
    <p class="my-class">a</p> 
 
    <p class="my-class">a</p> 
 
    </div> 
 
    <div class="div2"> 
 
    <p class="my-class">a</p> 
 
    <p class="my-class">a</p> 
 
    <p class="my-class">a</p> 
 
    <p class="my-class">b</p> <!-- This tag should not be red--> 
 
    </div> 
 
</div>

（この例では）他の色のものであろう

Answer 2

私はこれを行うだろう任意の単一のルールを知りませんが、簡単な回避策は、一緒に2つの別々のルールを使用することです：順序が重要であることを

.my-class { 
    color: red; 
} 

.div-2 .my-class:last-child { 
    color: // whatever you want the default to be 
} 

ノート、最後の子の設定

.my-class:not(:last-child) { 
 
    color: red; 
 
}

<p>Some text</p> 
 
<div class="my-container"> 
 
    <div class="div1"> 
 
    <p class="my-class">a</p> 
 
    <p class="my-class">b</p> 
 
    </div> 
 
    <div class="div2"> 
 
    <p class="my-class">c</p> 
 
    <p class="my-class">d</p> 
 
    <p class="my-class">e</p> 
 
    <p class="my-class">f</p> <!-- This tag should not be red--> 
 
    </div> 
 
</div>

：色は、これはあなたがどんな強制リフローせずに探している動作を取得する最初の

Answer 3

すべてを設定した後に行われる必要があります