Oppiskele Haaste: Rakennepseudoluokkien Harjoittelu | CSS-laatikkomalli ja Elementtien Välistys

Tehtävä

Työskentelemme joukon elementtien kanssa, ja tavoitteena on harjoitella erilaisten värien soveltamista rakenteellisten pseudoluokkien avulla. Tehtäväsi on seuraava:

Käytä väriä red ensimmäiseen elementtiin rakenteellisen pseudoluokan avulla.
Käytä väriä blue viimeiseen elementtiin rakenteellisen pseudoluokan avulla.
Käytä väriä green joka toiseen elementtiin rakenteellisen pseudoluokan avulla.

index.html

index.css

:first-child: Kohdistaa vanhemman ensimmäiseen lapseen.
:last-child: Kohdistaa vanhemman viimeiseen lapseen.
:nth-child(): Kohdistaa tiettyyn lapseen vanhemman sisällä sen sijainnin perusteella. Esimerkiksi joka toisen listaelementin (2, 4, 6, jne.) valitsemiseen voit käyttää :nth-child(2n).

index.html

index.css

Oliko kaikki selvää?

Kiitos palautteestasi!

Osio 3. Luku 6

Kysy tekoälyä

Kysy mitä tahansa tai kokeile jotakin ehdotetuista kysymyksistä aloittaaksesi keskustelumme

Awesome!

Completion rate improved to 2.56

Pyyhkäise näyttääksesi valikon

Tehtävä

Työskentelemme joukon elementtien kanssa, ja tavoitteena on harjoitella erilaisten värien soveltamista rakenteellisten pseudoluokkien avulla. Tehtäväsi on seuraava:

Käytä väriä red ensimmäiseen elementtiin rakenteellisen pseudoluokan avulla.
Käytä väriä blue viimeiseen elementtiin rakenteellisen pseudoluokan avulla.
Käytä väriä green joka toiseen elementtiin rakenteellisen pseudoluokan avulla.

index.html

index.css

:first-child: Kohdistaa vanhemman ensimmäiseen lapseen.
:last-child: Kohdistaa vanhemman viimeiseen lapseen.
:nth-child(): Kohdistaa tiettyyn lapseen vanhemman sisällä sen sijainnin perusteella. Esimerkiksi joka toisen listaelementin (2, 4, 6, jne.) valitsemiseen voit käyttää :nth-child(2n).

index.html

index.css

Oliko kaikki selvää?

Kiitos palautteestasi!

Osio 3. Luku 6