CSS último-hijo (-1)

Question

Estoy buscando un selector de CSS que me permita seleccionar el último hijo de la lista.

<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> 

método estático:

ul li:nth-child(5) 

método dinámico:

ul li:last-child(-1) 

que por supuesto no valida, también nth-last-child no parece proporcionar una forma dinámica .. Puedo recurrir a javascript, pero me pregunto si hay una manera de CSS que pasé por alto

Answer 1

Usted puede use :nth-last-child(); de hecho, además de :nth-last-of-type() no sé qué más podrías usar. No estoy seguro de lo que quiere decir con "dinámico", pero si quiere decir si el estilo se aplica al último segundo hijo secundario cuando se agregan más niños a la lista, sí lo hará. Interactive fiddle.

ul li:nth-last-child(2) 

Answer 2

A menos que se puede obtener PHP para etiquetar ese elemento con una clase que es mejor usar jQuery.

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