Gibt es eine Möglichkeit, mit CSS das letzte Element einer Liste auszuwählen?

Question

Angenommen, ich habe eine Liste wie folgt:

• Gegenstand 1
• Artikel2
• Punkt3

Gibt es einen CSS-Selektor, mit dem ich das letzte Element einer Liste direkt auswählen kann?In diesem Fall Punkt 3.

Prost!

Answer 1

Nicht dass ich wüsste.Die traditionelle Lösung besteht darin, die ersten und letzten Elemente mit class="first" und class="last" zu kennzeichnen, damit Sie sie identifizieren können.

Die CSS-Psudo-Klasse erstes Kind erhalten Sie das erste Element, aber nicht alle Browser unterstützen es.CSS3 wird haben auch das letzte Kind (Dies wird derzeit von Firefox und Safari unterstützt, jedoch nicht von IE 6/7/Beta 8)

Answer 2

Bis es ordnungsgemäß unterstützt wird, müssen Sie wie vorgeschlagen eine Klasse zu den „letzten“ Elementen hinzufügen.Sie müssen dies jedoch nicht manuell tun.Wenn Sie einen Javascript-Treffer vertragen können, werfen Sie einen Blick auf Folgendes:

• der jQuery :last-child-Selektor
• Halten Sie die Kinder Ihrer Elemente im Einklang mit dem Nachwuchs (ein ausführlicher Artikel von Alex Bischoff), eine spezielle, leichtere Methode

Beides vermeidet eine „Verunreinigung“ Ihres Markups und ist vollkommen akzeptabel, wenn Ihr Stil eine „nette Ergänzung“ und kein „Must-Have“-Designmerkmal ist.

Answer 3

Die Antwort auf diese Frage sollte aktualisiert werden!IE9 + Firefox (vor einiger Zeit) + Chrome, Safari unterstützen alle: last-of-type oder last-child