nicht angemeldet
Hallo allerseits,
ich sitze gerade an einer Aufgabe für die Uni, bei der ich trotz vorhandener Lösung einige Schwierigkeiten habe:
"Viele strukturelle Pseudoklassen wie :first-child, :nth-last-child, :first-of-type, :nth-of-type beziehen sich auf die Position eines Elements in einer Sequenz. CSS zählt Positionen nach einem sinnvollen Prinzip, andere Formalismen zählen nach einem anderen sinnvollen Prinzip.
a) Angenommen, Sie könnten weder ausprobieren noch nachschlagen, wie :first-of-type wirkt, sondern müssten überlegen, was plausibel ist. Dann kämen zwei verschiedene Mengen von Elementen in Frage, die der Selektor ul li:first-of-type in sinnvoller Weise aus dem folgenden Dokument auswählen könnte. Welche und warum?
b) Welche dieser beiden Mengen von Elementen wird von CSS tatsächlich selektiert, wenn ul li:first-of-type auf das folgende Dokument angewandt wird?"
<!DOCTYPE html PUBLIC "...">
<html>
<head>
<style type="text/css">
li { color: red; }
</style>
</head>
<body>
<ul>
<li id="A" class="u">1</li>
<li>
<ol>
<li id="B" class="u">2.1</li>
<li id="C" class="g">2.2</li>
<li id="D" class="u">2.3</li>
<li id="E" class="g">2.4</li>
</ol>
</li>
<li id="F" class="u">3</li>
</ul>
</body>
</html>
Lösung:
a)
1. Zählweise relativ zum vorherigen Selektor.
2. Zählweise relativ zum jeweiligen Elternelement, das gar nicht im Selektor vorkommen muss.
b) CSS zählt relativ zum jeweiligen Elternelement.
Meine Fragen:
- Ist der vorherige Selektor in diesem Fall "li"?
- Ist das vorherige Elternelement in diesem Fall "ul"?
- Ich habe einen kleinen Versuch gemacht und innerhalb des <style>-Tags "ul li:first-of-type { color: blue; }" hinzugefügt und im neuesten Firefox-Release werden "1" und "2. 2.1" blau angezeigt, was mich sehr überrascht. Warum wird nicht nur die "1" blau angezeigt?
Ich bitte wirklich ganz dringend um Hilfe, da ich hier schon seit einigen Stunden davor sitze und absolut nicht weiterkomme.
Vielen Dank für Eure Mühe und Eure Unterstützung!
Gruß
HTML-Newbie
Matthias Apsel
Gunnar Bittersmann