Ich suche nach einem CSS-Selektor, mit dem ich das vorletzte Kind der Liste auswählen kann.
<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>
Statische Methode:
ul li:nth-child(5)
Dynamische Methode:
ul li:last-child(-1)
was natürlich nicht validiert, auch das n-te-letzte Kind scheint keinen dynamischen Weg zu bieten. Ich kann auf Javascript zurückgreifen, aber ich frage mich, ob es einen CSS-Weg gibt, den ich übersehen habe
css
css-selectors
Hedde van der Heide
quelle
quelle
Antworten:
Sie können verwenden
:nth-last-child()
; Außerdem:nth-last-of-type()
weiß ich nicht, was Sie sonst noch verwenden könnten. Ich bin nicht sicher, was Sie unter "dynamisch" verstehen, aber wenn Sie meinen, ob der Stil für das neue vorletzte Kind gilt, wenn mehr Kinder zur Liste hinzugefügt werden, wird dies der Fall sein. Interaktive Geige.quelle
:nth-child(5)
und zu verwenden:last-child
. Kommentare wie diese sollten entweder auf die Frage eingehen oder für sich behalten werden.Wenn Sie PHP nicht dazu bringen können, dieses Element mit einer Klasse zu kennzeichnen, sollten Sie jQuery verwenden.
quelle
:nth-last-child()
nur weil John glaubt, dass niemand es verwendet .