使用CSS/Jquery将样式应用于ul中的最后一个li

Question

给出以下HTML:

<ul>
   <li><div>Some content</div></li>
   <li><div>some more content</div></li>
   <li><div>final content</div></li>
</ul>

我想在每个div周围应用顶部边框.在最后一个div我想放一个底边.我的目标是IE7/8.我的顶部边框工作正常,我需要帮助获得底部边框.

我试过了:

   ul > li:last-child > div
    {
        border-bottom: solid 1px black;
    }

我也尝试过使用last-type-of.

我正在寻找一个CSS解决方案和一个Jquery解决方案

Answer 1

为什么你有一个<div>内部<li>？没有它完全可能.

无论如何,这是如何使用jQuery:

$('ul > li:last-child > div').css('border-bottom','1px solid black');

Answer 2

:last-child是CSS3,不同于:在CSS2中引入的first-child,并且没有IE支持.我相信以下是使用jquery实现它的最安全的方法

$('li').last().addClass('someClass');