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
Practice
Projects
Quizzes & Challenges
Quizzes
Challenges
/
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

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