关于html：基于nth-child选择器的标题的替代颜色

Alternate colors for headers based on nth-child selector

我正在尝试创建替代的颜色标题，而不向其声明各种标题样式。我决定使用nth-child选择器，但似乎无法创建所需的颜色。

JSFiddle：http://jsfiddle.net/CRh6L/

HTML：

1
2
3
4
5
6
7
8
9
10
11
12
13

<h3 class="tips">Header 1
<p class="tips">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus ac purus neque. Nunc feugiat neque et eleifend lacinia. Proin a nunc imperdiet lacus placerat malesuada. Nam est libero, egestas sit amet leo nec, tempus placerat velit. Mauris pellentesque arcu eget pellentesque imperdiet. Mauris quis est lacinia, sodales nisl sit amet, dapibus ante. Ut quis arcu eleifend, ultrices tortor id, convallis arcu. Integer ut libero vitae dolor pretium porta. Phasellus sed bibendum lorem, in sodales tortor. Integer rutrum a orci non luctus.</p>

<h3 class="tips">Header 2
<p class="tips">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus ac purus neque. Nunc feugiat neque et eleifend lacinia. Proin a nunc imperdiet lacus placerat malesuada. Nam est libero, egestas sit amet leo nec, tempus placerat velit. Mauris pellentesque arcu eget pellentesque imperdiet. Mauris quis est lacinia, sodales nisl sit amet, dapibus ante. Ut quis arcu eleifend, ultrices tortor id, convallis arcu. Integer ut libero vitae dolor pretium porta. Phasellus sed bibendum lorem, in sodales tortor. Integer rutrum a orci non luctus.</p>

<h3 class="tips">Header 3
<p class="tips">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus ac purus neque. Nunc feugiat neque et eleifend lacinia. Proin a nunc imperdiet lacus placerat malesuada. Nam est libero, egestas sit amet leo nec, tempus placerat velit. Mauris pellentesque arcu eget pellentesque imperdiet. Mauris quis est lacinia, sodales nisl sit amet, dapibus ante. Ut quis arcu eleifend, ultrices tortor id, convallis arcu. Integer ut libero vitae dolor pretium porta. Phasellus sed bibendum lorem, in sodales tortor. Integer rutrum a orci non luctus.</p>

<h3 class="tips">Header 4
<p class="tips">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus ac purus neque. Nunc feugiat neque et eleifend lacinia. Proin a nunc imperdiet lacus placerat malesuada. Nam est libero, egestas sit amet leo nec, tempus placerat velit. Mauris pellentesque arcu eget pellentesque imperdiet. Mauris quis est lacinia, sodales nisl sit amet, dapibus ante. Ut quis arcu eleifend, ultrices tortor id, convallis arcu. Integer ut libero vitae dolor pretium porta. Phasellus sed bibendum lorem, in sodales tortor. Integer rutrum a orci non luctus.</p>

CSS：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18

p.tips {
padding:10px 30px 20px 30px;
font-size:14pt;
}

h3.tips {
padding:0px 30px 0px 30px;
font-family:OpenSans-Semibold, San-Serif;
font-size:20pt;
color:#E74C3C;
}

h3.tips:first-child h3.tips:nth-child(odd) {
color:blue;
}
h3.tips:last-child {
color:#C0392B;
}

我在这里做错了什么？我只需要为第一个和奇数个孩子获得备用颜色。