Werken met CSS-Modules
CSS-modules genereren automatisch unieke classnamen, waardoor CSS beperkt blijft tot een specifiek component en stijlconflicten worden voorkomen. Eenvoudige CSS-regels kunnen binnen de CSS-modules worden geschreven.
Terug naar het project
Maak een CSS-module genaamd home.module.css aan in de map app/ui en plak de volgende CSS-regels:
.circle {
height: 2.5rem;
width: 2.5rem;
background-color: rgb(255 255 255);
border-radius: 9999px;
}
Importeer het bestand home.module.css in het bestand app/page.tsx en pas vervolgens de klasse styles.circle toe op het div-element dat eerder is aangemaakt.
In de praktijk
Bedankt voor je feedback!
Vraag AI
Vraag AI
Vraag wat u wilt of probeer een van de voorgestelde vragen om onze chat te starten.
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.08Werken met CSS-Modules
Veeg om het menu te tonen
CSS-modules genereren automatisch unieke classnamen, waardoor CSS beperkt blijft tot een specifiek component en stijlconflicten worden voorkomen. Eenvoudige CSS-regels kunnen binnen de CSS-modules worden geschreven.
Terug naar het project
Maak een CSS-module genaamd home.module.css aan in de map app/ui en plak de volgende CSS-regels:
.circle {
height: 2.5rem;
width: 2.5rem;
background-color: rgb(255 255 255);
border-radius: 9999px;
}
Importeer het bestand home.module.css in het bestand app/page.tsx en pas vervolgens de klasse styles.circle toe op het div-element dat eerder is aangemaakt.
In de praktijk
Bedankt voor je feedback!
