CSS:使用ID选择第n个元素？

Question

这是我的HTML:

<dl id="id">
    <dt>test</dt>
    <dd>whatever</dd>
    <dt>test1</dt>
    <dd>whatever2</dd>
    ....
</dl>

我想选择第三个dd,但我不能让它工作.这是我试过的:

dl#id dd:nth-child(3) {  
     color: yellow;
}

风格不适用,哪有错？

谢谢!

Answer 1

第三个孩子#id实际上是<dt>test1</dt>,所以选择器不匹配任何东西.

在:nth-of-type这里使用选择器更合适:

dl#id dd:nth-of-type(3)

也可以利用相当严格的HTML结构(成对<dt>/ <dd>)并简单地写入dl#id :nth-child(6),但在这种情况下它是没有意义的(浏览器支持AFAIK对于两个选择器都是相同的).