Haaste: Käytä CSS-moduuleja Reactissa
Tehtävä: Käyttäjäkortin rakentaminen CSS-moduuleilla
Tässä tehtävässä suunnitellaan käyttäjäkortti, joka näyttää käyttäjän valokuvan ja olennaiset tiedot. Sovella sopivia tyylejä jokaiseen komponenttiin ja varmista niiden asianmukainen käyttö. Tavoitteena on saavuttaa seuraavanlainen käyttöliittymä:
Tehtävä:
- Tiedostossa
UserInfo.jsxtuo tyylitiedosto (UserInfo.module.css) ja määritä se nimellästyylien liittämistä varten. - Sovelluksen rakentamisen viimeistelemiseksi tuo
UserInfo.jsxtiedostoApp.jsx-tiedostoon.
- Tiedoston tuomiseen käytetään
import-lausetta ja määritetään lähdetiedosto. - CSS-tiedoston liittämiseksi s:ään, tuo se muodossa
import s from "path_to_the_file";. - Käyttääksesi UserInfo-komponenttia
App-komponentissa, käytä syntaksia</UserInfo />.
Oliko kaikki selvää?
Kiitos palautteestasi!
Osio 2. Luku 10
Kysy tekoälyä
Kysy tekoälyä
Kysy mitä tahansa tai kokeile jotakin ehdotetuista kysymyksistä aloittaaksesi keskustelumme
Awesome!
Completion rate improved to 2.17Haaste: Käytä CSS-moduuleja Reactissa
Pyyhkäise näyttääksesi valikon
Tehtävä: Käyttäjäkortin rakentaminen CSS-moduuleilla
Tässä tehtävässä suunnitellaan käyttäjäkortti, joka näyttää käyttäjän valokuvan ja olennaiset tiedot. Sovella sopivia tyylejä jokaiseen komponenttiin ja varmista niiden asianmukainen käyttö. Tavoitteena on saavuttaa seuraavanlainen käyttöliittymä:
Tehtävä:
- Tiedostossa
UserInfo.jsxtuo tyylitiedosto (UserInfo.module.css) ja määritä se nimellästyylien liittämistä varten. - Sovelluksen rakentamisen viimeistelemiseksi tuo
UserInfo.jsxtiedostoApp.jsx-tiedostoon.
- Tiedoston tuomiseen käytetään
import-lausetta ja määritetään lähdetiedosto. - CSS-tiedoston liittämiseksi s:ään, tuo se muodossa
import s from "path_to_the_file";. - Käyttääksesi UserInfo-komponenttia
App-komponentissa, käytä syntaksia</UserInfo />.
Oliko kaikki selvää?
Kiitos palautteestasi!
Osio 2. Luku 10
