html - CSS プロパティをクラスに適用しますが、要素に別の特定のクラスがある場合のみです

Question

私はこのhtmlを持っています:

 <li class="arrow branches"></li>
 <li class="arrow branches"></li>
 <li class="arrow branches"></li>

 <li class="arrow"></li>
 <li class="arrow"></li>
 <li class="arrow"></li>

「矢印ブランチ」クラスにのみcssコマンドを与えたいのですが、「矢印」クラスに影響を与えないcssを与えるにはどうすればよいですか?

Answer 1

クラスを作成します.branches。

.branches{
    color:#f00;
}

分岐と矢印を持つ要素のみに適用する場合は、それらをまとめます。

.arrow.branches{
    color:#f00;
}

しかし、それを複数のクラスに適用したい場合も簡単です：

.branches, .otherClass{
    color:#f00;
}

Answer 2

それは非常に簡単です：

li.arrow.branches
{...styles...}

これは、ブランチと矢印のクラスを持つ LI 要素を選択しますが、矢印自体は選択しません。

Answer 3

.arrow.branches { // your css }

両方のクラスを持つ要素に対してのみ機能します。