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

的后代选择 .h1color h1选择所有h1与该类的元素的后代元素h1color.但是你需要所有带有h1color类的h1元素作为元素的后代.

所以只需更改选择器的顺序:

h1 .h1color {
    color: #862E06;
}