CSS два цвета h1

Question

у меня есть этот CSS код:

h1 { 
    font-size:22px; 
    color:#341C12; 
    font-weight:normal; 
    font-style:italic; 
} 
.h1color h1{ 
    color:#862E06; 
} 

и этот HTML код

<h1>News <span class="h1color">&amp; events</span></h1> 

но не работает. хочу я хочу сделать, это есть первый текст h1 будет цвет # 341C12 и другой текст # 862E06 с использованием только 1 тег h1 ..

Answer 1

этом:

.h1color h1{ 

Должно быть:

h1 .h1color { 

заказ parent child, если вы всегда просто 1 пядь, вы можете также оставить из класса, и сделать:

h1 span { 

Answer 2

descendant selector.h1color h1 выбирает все h1 элементы, которые являются потомками элемента с классом h1color. Но вам нужны все элементы класса h1color, которые являются потомками элемента h1.

Так просто изменить порядок селекторов:

h1 .h1color { 
    color: #862E06; 
}