Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Lære Arbejde med CSS-moduler | Opsætning af et Next.js-projekt
Next.js 14 Ekspertise til Udvikling af Moderne Webapplikationer

bookArbejde 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

Var alt klart?

Hvordan kan vi forbedre det?

Tak for dine kommentarer!

Sektion 2. Kapitel 6

Spørg AI

expand

Spørg AI

ChatGPT

Spørg om hvad som helst eller prøv et af de foreslåede spørgsmål for at starte vores chat

Suggested prompts:

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

bookArbejde 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

Var alt klart?

Hvordan kan vi forbedre det?

Tak for dine kommentarer!

Sektion 2. Kapitel 6
some-alt