CSS/Selektoren/Pseudoklasse/strukturelle Pseudoklasse/last-child

Aus SELFHTML-Wiki
Wechseln zu: Navigation, Suche

Der Selektor :last-child kann verwendet werden, um das letzte Kind eines Elternelementes zu selektieren.

Der Titel dieses Artikels ist mehrdeutig. Die JavaScript-Eigenschaft lastChild finden sie hier.



  • CSS 3.0
  • IE 9
  • Firefox
  • Chrome
  • Safari
  • Opera
Beispiel ansehen …
<!doctype html> <html> <head> <meta charset="utf-8"> <title>CSS-Beispiel: Pseudoklasse last-child</title> <style> :last-child { border: 3px solid blue; } </style> </head> <body> <h1>Strukturelle Pseudoklassen</h1> <h2>Kindselektoren</h2> <p>Ein Absatz</p> <p>Hier beginnt ein weiterer Absatz mit einer Liste,</p> <ul> <li>1. Listenelement</li> <li>2. Listenelement</li> <li>3. Listenelement</li> </ul> <p>welcher hier fortgesetzt werden muss, weil ein Absatz keine Blockelemente enthalten darf. </p> </body> </html>
In diesem Beispiel erhält der 3. Absatz einen blauen Rahmen, weil er das letzte Kindelement des Elementes „body“ ist. Ebenso erhält das dritte Listenelement einen blauen Rahmen, weil es das letzte Kindelement der ungeordneten Liste ist. Auch auf „body“ selbst als letztes Kind des html-Elements trifft der Selektor zu.

Weblinks[Bearbeiten]