html - 如果 last li 是链接，则 last-child 选择器不起作用

Question

我想让最后一个列表项具有不同的颜色。我怎样才能正确解决它？

js fiddle

HTML

<div class="wrap">
    <ul>
        <a><li>AAAA</li></a>
        <a><li>BBBB</li></a>
        <a><li>CCCC</li></a>
    </ul>
</div>

CSS

.wrap li{
    color: green;
    background: blue;

}

.wrap li:last-child{
    color: red;
    background: yellow;
}

Answer 1

所有 li 元素都是它们各自父元素的最后(唯一)子元素。您想要使用 .wrap a:last-child li 来定位列表中的最后一个 a，然后是它的 li 子级。

Demo