CSS last-child（-1）

Question

私はリストの最後の子を選択できるCSSセレクターを探しています。

<ul> 
    <li>1</li> 
    <li>2</li> 
    <li>3</li> 
    <li>4</li> 
    <li>5</li> <!-- select the pre last item dynamically no matter how long this list is --> 
    <li>6</li> 
</ul> 

staticメソッド：

ul li:nth-child(5) 

ダイナミック方法：もちろんn番目-最後の子はしていないようにも、検証しません

ul li:last-child(-1) 

動的な方法を提供..私はjavascriptにフォールバックすることができますが、私は見落としたCSSの方法がある場合は私は疑問に思っている

Answer 1

You can use :nth-last-child();実際には、:nth-last-of-type()のほかに、私は他にあなたが使うことができるか分からない。私はあなたが "ダイナミック"とは何を意味しているのかよく分かりませんが、もっと子供がリストに追加されたときにスタイルが新しい最後の2番目の子に適用されるかどうかを意味するならば、そうです。あなたはクラスでその要素にラベルを付けるためにPHPを取得することができない限りInteractive fiddle.

ul li:nth-last-child(2) 

Answer 2

あなたはjQueryのを使用することをお勧めします。

jQuery(document).ready(function() { 
    $count = jQuery("ul li").size() - 1; 
    alert($count); 
    jQuery("ul li:nth-child("+$count+")").css("color","red"); 
});