複数の任意の子供のショートハンド

Question

CSSでは、与えられたクラスの3つのサブクラスをスタイルしたい場合、ルートクラスが存在していなくてもよい方法でショートハンドがありますか各サブクラスで繰り返されますか？例えば

、私はこのHTMLを持っているとしましょう：

<div class="parent1"> 
    <div class="subClass1">Sub-Class-1</div> 
    <div class="subClass2">Sub-Class-2</div> 
    <div class="subClass3">Sub-Class-3</div> 
    <div class="subClass4">Sub-Class-4</div> 
    <div class="subClass5">Sub-Class-5</div> 
    <div class="subClass6">Sub-Class-6</div> 
</div> 

<div class="parent2"> 
    <div class="subClass1">Sub-Class-1</div> 
    <div class="subClass2">Sub-Class-2</div> 
    <div class="subClass3">Sub-Class-3</div> 
    <div class="subClass4">Sub-Class-4</div> 
    <div class="subClass5">Sub-Class-5</div> 
    <div class="subClass6">Sub-Class-6</div> 
</div> 

私は、サブクラス1、3、6 の親1（parent2サブクラスに影響を与えずに）赤を作りたいです。私はこれを行うだろう方法はCSSであるある：

.parent1 .subClass1, 
.parent1 .subClass3, 
.parent1 .subClass6 
{ 
    color: red; 
} 

は、私が代わりにこのような何かを行うことができますCSSでの構文があります：

.parent1 (.subClass1, .subClass3, .subClass6) 
{ 
    color: red; 
} 

を... 親1ようにクラスは一度だけタイプする必要がありますか？

Answer 1

ないあなたが記述方法が、あなたの具体的な例では、あなたはすべての奇数の子供のスタイルをnth-childを使用することができます。

.parent1 div:nth-child(odd) { 

} 

それとも、ターゲットにしたいクラスのそれぞれが共通のテキストを持っている場合に使用できる

属性セレクタ：

これは、そのクラスのどこかにsubClassを持つparent1のすべての子を対象とします。したがって、あなたの場合、すべての子供を選択します。