如何用CSS选择第n个孩子?

Joh*_*ore 2 html css css-selectors

鉴于以下HTML和CSS,我想使用nth-child伪类突出显示列表中的第二个元素.我如何更改以下内容来完成此操作?

小提琴:http://jsfiddle.net/jeljeljel/DHKj5/

HTML

<div id="topdiv">
    <div class="middlediv">
        <div>A</div>
        <div>B</div>
        <div>C</div>
    </div>
</div>
Run Code Online (Sandbox Code Playgroud)

CSS

.topdiv > div:nth-child(n+2) {
    font-weight:bold;
    font-color:red;
}
Run Code Online (Sandbox Code Playgroud)

PSL*_*PSL 7

Demo

#topdiv .middlediv > div:nth-child(2) {
    font-weight:bold;
    color:red;
}
Run Code Online (Sandbox Code Playgroud)

您需要使用#id和.class

只是为了解释n+2将选择第二个元素之后的所有兄弟姐妹.也>将仅选择匹配选择器的直接子节点.