CSS/Selektoren/Pseudoklasse/strukturelle Pseudoklasse/first-of-type

Aus SELFHTML-Wiki
Wechseln zu: Navigation, Suche

Mithilfe des Selektors :first-of-type ist es möglich, die jeweils ersten Kindelemente einer bestimmten Art auszuwählen.

  • CSS 3.0
  • IE 9
  • Leer
  • Chrome
  • Safari
  • Opera
Beispiel ansehen …
<!doctype html> <html> <head> <meta charset="utf-8"> <title>CSS-Beispiel: Pseudoklasse first-of-type</title> <style> body { width: 30em; } h2:first-of-type { border: 3px solid blue; } </style> </head> <body> <h1>Strukturelle Pseudoklassen</h1> <h2>Kindselektoren</h2> <p>Ein Absatz</p> <h2>Geschwisterselektoren</h2> <p>Ein Absatz</p> </body> </html>
In diesem Beispiel erhält die erste Überschrift zweiter Ordnung einen blauen Rahmen.
Beachten Sie: Der Selektor h2:first-child könnte hier nichts selektieren, weil die Überschriften zweiter Ordnung das zweite und vierte Kind des body-Elements sind.

Weblinks[Bearbeiten]