Arbejde med CSS-moduler
CSS-moduler opretter automatisk unikke klassenavne, hvilket muliggør CSS-afgrænsning til en specifik komponent og eliminerer stilkonflikter. Enkle CSS-regler kan skrives inde i CSS-modulerne.
Tilbage til projektet
Opret et CSS-modul kaldet home.module.css i mappen app/ui, og indsæt følgende CSS-regler:
.circle {
height: 2.5rem;
width: 2.5rem;
background-color: rgb(255 255 255);
border-radius: 9999px;
}
Vi skal importere filen home.module.css i app/page.tsx og derefter anvende klassen styles.circle på det div-element, vi tidligere har oprettet.
I praksis
Tak for dine kommentarer!
Spørg AI
Spørg AI
Spørg om hvad som helst eller prøv et af de foreslåede spørgsmål for at starte vores chat
How do I create a CSS module in the app/ui folder?
Can you explain how to import and use the CSS module in page.tsx?
What does the .circle class do in this example?
Awesome!
Completion rate improved to 2.08
Arbejde med CSS-moduler
Stryg for at vise menuen
CSS-moduler opretter automatisk unikke klassenavne, hvilket muliggør CSS-afgrænsning til en specifik komponent og eliminerer stilkonflikter. Enkle CSS-regler kan skrives inde i CSS-modulerne.
Tilbage til projektet
Opret et CSS-modul kaldet home.module.css i mappen app/ui, og indsæt følgende CSS-regler:
.circle {
height: 2.5rem;
width: 2.5rem;
background-color: rgb(255 255 255);
border-radius: 9999px;
}
Vi skal importere filen home.module.css i app/page.tsx og derefter anvende klassen styles.circle på det div-element, vi tidligere har oprettet.
I praksis
Tak for dine kommentarer!