Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
学ぶ Challenge: Practice Structural Pseudo-Classes | Section
CSS Core Fundamentals

bookChallenge: Practice Structural Pseudo-Classes

メニューを表示するにはスワイプしてください

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.html

index.css

index.css

copy
  • :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.html

index.css

index.css

copy

すべて明確でしたか?

どのように改善できますか?

フィードバックありがとうございます!

セクション 1.  22

AIに質問する

expand

AIに質問する

ChatGPT

何でも質問するか、提案された質問の1つを試してチャットを始めてください

セクション 1.  22
some-alt