如何在CSS中选择具有特定类名的“最后一个子”？

Question

如何在CSS中选择具有特定类名的“最后一个子”？

<ul>
    <li class="list">test1</li>
    <li class="list">test2</li>
    <li class="list">test3</li>
    <li>test4</li></ul>

如何选择具有类名的“最后一个子”：列单?

<style>
    ul li.list:last-child{background-color:#000;}</style>

我知道上面的例子不起作用，但是有什么类似的东西能起作用吗？

重要：

(A)我不能用ul li:nth-child(3)因为它也有可能出现在第四位或第五位。

(B)没有JavaScript。

任何帮助都将不胜感激，谢谢！

Answer 1

我建议您利用这样的事实：您可以为这样的元素分配多个类：<ul> &nbsp;&nbsp;&nbsp;&nbsp;<li&nbsp;class="list">test1</li> &nbsp;&nbsp;&nbsp;&nbsp;<li&nbsp;class="list">test2</li> &nbsp;&nbsp;&nbsp;&nbsp;<li&nbsp;class="list&nbsp;last">test3</li> &nbsp;&nbsp;&nbsp;&nbsp;<li>test4</li></ul>最后一个元素具有list类，但也具有last类，您可以使用该类设置任何您想要的CSS属性，如下所示：ul&nbsp;li.list&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;color:&nbsp;#FF0000;}ul&nbsp;li.list.last&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;background-color:&nbsp;#000;}