Utfordring: Bruk CSS-moduler i React
Oppgave: Bygg et brukerkort med CSS-moduler
I denne oppgaven skal du designe et brukerkort som viser brukerens bilde og relevant informasjon. Bruk passende stiler på hver komponent og sørg for korrekt bruk. Målet vårt er å oppnå følgende brukergrensesnitt:
Oppgaven er:
- I
UserInfo.jsx-filen, importer stilfilen (UserInfo.module.css) og tildel den somsfor stiltilknytning. - For å fullføre appen, importer
UserInfo.jsx-filen iApp.jsx.
- For å importere en fil, bruk
import-setningen og spesifiser kildefilen. - For å knytte CSS-filen til s, importer den med
import s from "path_to_the_file";. - For å bruke UserInfo-komponenten i
App-komponenten, bruk syntaksen</UserInfo />.
Alt var klart?
Takk for tilbakemeldingene dine!
Seksjon 2. Kapittel 10
Spør AI
Spør AI
Spør om hva du vil, eller prøv ett av de foreslåtte spørsmålene for å starte chatten vår
Awesome!
Completion rate improved to 2.17Utfordring: Bruk CSS-moduler i React
Sveip for å vise menyen
Oppgave: Bygg et brukerkort med CSS-moduler
I denne oppgaven skal du designe et brukerkort som viser brukerens bilde og relevant informasjon. Bruk passende stiler på hver komponent og sørg for korrekt bruk. Målet vårt er å oppnå følgende brukergrensesnitt:
Oppgaven er:
- I
UserInfo.jsx-filen, importer stilfilen (UserInfo.module.css) og tildel den somsfor stiltilknytning. - For å fullføre appen, importer
UserInfo.jsx-filen iApp.jsx.
- For å importere en fil, bruk
import-setningen og spesifiser kildefilen. - For å knytte CSS-filen til s, importer den med
import s from "path_to_the_file";. - For å bruke UserInfo-komponenten i
App-komponenten, bruk syntaksen</UserInfo />.
Alt var klart?
Takk for tilbakemeldingene dine!
Seksjon 2. Kapittel 10
