CSS/Selektoren/Pseudoklasse/strukturelle Pseudoklasse/first-of-type
Aus SELFHTML-Wiki
< CSS | Selektoren | Pseudoklasse | strukturelle Pseudoklasse
Mithilfe des Selektors :first-of-type ist es möglich, die jeweils ersten Kindelemente einer bestimmten Art auszuwählen.
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]
- CSS3 structural pseudo-class selector tester (Lea Verou)
