为最后一个孩子留下最后的孩子

Question

我有以下HTML:

<section></section>

<section id="top">
    <ul>
        <li>1</li>
        <li>2</li>
        <li>3</li>
        <li>4</li>
        <li>5</li>
    </ul>
    <ul>
        <li>1</li>
        <li>2</li>
        <li>3</li>
        <li>4</li>
        <li>5</li>
    </ul>
    <ul>
        <li>1</li>
        <li>2</li>
        <li>3</li>
        <li>4</li>   <!-- STYLE THIS -->
        <li>5</li>   <!-- STYLE THIS -->
    </ul>
</section>

<section></section>

我有动态生成的HTML,我如何设置以上两种风格？应用样式的section有id="top",款式最后2 list-items中的最后一个ul.

Answer 1

像这样的东西？

#top > ul:last-of-type li:nth-last-child(-n+2) {
    background:aqua;
}

jsFiddle在这里

使用选择器的组合 - :last-of-type和:nth-last-child.

注意 - IE8并没有完全支持这一点.