子セレクターを複製せずに、選択した親の特定の子のみをターゲットにして、セレクターを長さの点でチャートから外す方法はありますか?
たとえば、特定の div の最初の子段落を選択したいとします。
CSSは次のようになります
.funny > p:first-child, .sad > p:first-child {
color: red
}
マークアップ
<div class="funny">
<p>This is red</p>
<p>This is whatever</p>
<p>This is whatever</p>
<p>This is whatever</p>
</div>
<div class="wildcrazy">
<p>This is whatever</p>
<p>This is whatever</p>
<p>This is whatever</p>
<p>This is whatever</p>
</div>
<div class="sad">
<p>This is red</p>
<p>This is whatever</p>
<p>This is whatever</p>
<p>This is whatever</p>
</div>
明らかに、私がターゲットにしたい面白いものや悲しいもの以外の多くの div には、他の多くの最初の段落が存在する可能性があります。
私の質問は次のとおりです。どのように子を宣言し、すべての親を先頭に追加できますか? 何かのようなもの:
.funny, .sad, .another_div_class0, .another_div_class1, .another_div_class2, .another_div_class3 > p:first-child
それ以外の
.funny p:first, .sad p:first-child, .another_div_class0 p:first-child, .another_div_class1 p:first-child, .another_div_class2 p:first-child, .another_div_class3 p:first-child