将CSS属性应用于类，但仅当元素具有另一个特定的类时

Question

I have this 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>

I want to give css commands only for "arrow branches" classes,how can I give them css that wont effect the "arrow" classes?

Answer 1

Create the class .branches :

.branches{
    color:#f00;
}

If you want to apply it to only those elements that have branches and arrows then put them together:

.arrow.branches{
    color:#f00;
}

But if you want to apply it to more than one class thats easy too:

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

Answer 2

It's extremely simple:

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

This selects LI elements with the classes branches AND arrow, but not arrow on its own.

Answer 3

.arrow.branches { // your css }

仅适用于两个类的元素。