Lernen Challenge: Practice Structural Pseudo-Classes | The CSS Box Model & Spacing Elements

Task

We are working with a set of elements, and the goal is to practice applying different colors using structural pseudo-classes. Your task is as follows:

Apply the color red to the first element using a structural pseudo-class.
Apply the color blue to the last element using a structural pseudo-class.
Apply the color green to every second element using a structural pseudo-class.

index.html

index.css

:first-child: Targets the first child of a parent element.
:last-child: Targets the last child of a parent element.
:nth-child(): Targets a specific child of a parent element based on its position in the list. For instance, to select every second list item (2, 4, 6, etc.), you can use :nth-child(2n).

index.html

index.css

War alles klar?

Danke für Ihr Feedback!

Abschnitt 3. Kapitel 6

Fragen Sie AI

Fragen Sie alles oder probieren Sie eine der vorgeschlagenen Fragen, um unser Gespräch zu beginnen

Suggested prompts:

Fragen Sie mich Fragen zu diesem Thema

Zusammenfassen Sie dieses Kapitel

Zeige reale Beispiele

Awesome!

Completion rate improved to 2.5

Swipe um das Menü anzuzeigen

Task

We are working with a set of elements, and the goal is to practice applying different colors using structural pseudo-classes. Your task is as follows:

Apply the color red to the first element using a structural pseudo-class.
Apply the color blue to the last element using a structural pseudo-class.
Apply the color green to every second element using a structural pseudo-class.

index.html

index.css

:first-child: Targets the first child of a parent element.
:last-child: Targets the last child of a parent element.
:nth-child(): Targets a specific child of a parent element based on its position in the list. For instance, to select every second list item (2, 4, 6, etc.), you can use :nth-child(2n).

index.html

index.css

War alles klar?

Danke für Ihr Feedback!

Abschnitt 3. Kapitel 6