Estou procurando um seletor de css que permita selecionar o filho anterior da 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 obviamente não valida, o enésimo último filho não parece fornecer uma maneira dinâmica .. Posso usar o javascript, mas estou me perguntando se existe uma maneira de css que eu ignorei
css
css-selectors
Hedde van der Heide
fonte
fonte
Respostas:
Você pode usar
:nth-last-child()
; na verdade, além disso:nth-last-of-type()
, não sei mais o que você poderia usar. Não sei ao certo o que você quer dizer com "dinâmico", mas se você quer dizer se o estilo se aplica ao segundo segundo filho quando mais filhos forem adicionados à lista, sim. Violino interativo.fonte
:nth-child(5)
e:last-child
. Comentários como esse devem ser colocados em questão ou mantidos em sigilo.A menos que você consiga que o PHP rotule esse elemento com uma classe, é melhor usar o jQuery.
fonte
:nth-last-child()
apenas porque John acha que ninguém o usa .