Työskentely CSS-moduulien Kanssa
CSS-moduulit luovat automaattisesti yksilölliset luokkanimet, mahdollistaen CSS:n rajaamisen tiettyyn komponenttiin ja estäen tyylien yhteentörmäykset. Yksinkertaiset CSS-säännöt voidaan kirjoittaa CSS-moduuleihin.
Takaisin projektiin
Luodaan CSS-moduuli nimeltä home.module.css kansioon app/ui ja liitetään seuraavat CSS-säännöt:
.circle {
height: 2.5rem;
width: 2.5rem;
background-color: rgb(255 255 255);
border-radius: 9999px;
}
home.module.css-tiedoston tuonti app/page.tsx-tiedostoon ja styles.circle-luokan käyttö aiemmin luodussa div-elementissä.
Käytännössä
Kiitos palautteestasi!
Kysy tekoälyä
Kysy tekoälyä
Kysy mitä tahansa tai kokeile jotakin ehdotetuista kysymyksistä aloittaaksesi keskustelumme
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.08Työskentely CSS-moduulien Kanssa
Pyyhkäise näyttääksesi valikon
CSS-moduulit luovat automaattisesti yksilölliset luokkanimet, mahdollistaen CSS:n rajaamisen tiettyyn komponenttiin ja estäen tyylien yhteentörmäykset. Yksinkertaiset CSS-säännöt voidaan kirjoittaa CSS-moduuleihin.
Takaisin projektiin
Luodaan CSS-moduuli nimeltä home.module.css kansioon app/ui ja liitetään seuraavat CSS-säännöt:
.circle {
height: 2.5rem;
width: 2.5rem;
background-color: rgb(255 255 255);
border-radius: 9999px;
}
home.module.css-tiedoston tuonti app/page.tsx-tiedostoon ja styles.circle-luokan käyttö aiemmin luodussa div-elementissä.
Käytännössä
Kiitos palautteestasi!
