Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.Lære Utfordring: Responsive Oppsett i Praksis | Responsivitet og Tilpasning
Tailwind CSS for Webbutvikling

bookUtfordring: Responsive Oppsett i Praksis

Oppgave

Fullfør den oppgitte HTML-strukturen ved å fylle inn de manglende Tailwind CSS-klassene i henhold til de angitte layoutkravene.

  • Containeren skal ha ulik polstring ved forskjellige breakpoints:
    • Standard polstring: p-4;
    • Ved sm breakpoint: p-6;
    • Ved md breakpoint: p-8;
    • Ved lg breakpoint: p-10;
    • Ved xl breakpoint: p-12.
  • Teksten skal ha ulike farger og størrelser ved forskjellige breakpoints.
    • Standard tekststørrelse: text-base, farge: text-gray-700;
    • Ved sm breakpoint: text-lg, farge: text-gray-600;
    • Ved md breakpoint: text-xl, farge: text-gray-500;
    • Ved lg breakpoint: text-2xl, farge: text-gray-400;
    • Ved xl breakpoint: text-3xl, farge: text-gray-300.
index.html

index.html

copy
  • For beholderen, bruk p-4 sm:p-6 md:p-8 lg:p-10 xl:p-12;
  • For teksten, bruk text-base sm:text-lg md:text-xl lg:text-2xl xl:text-3xl text-gray-700 sm:text-gray-600 md:text-gray-500 lg:text-gray-400 xl:text-gray-300.
index.html

index.html

copy

Alt var klart?

Hvordan kan vi forbedre det?

Takk for tilbakemeldingene dine!

Seksjon 5. Kapittel 2

Spør AI

expand

Spør AI

ChatGPT

Spør om hva du vil, eller prøv ett av de foreslåtte spørsmålene for å starte chatten vår

Suggested prompts:

Can you show me where to place these Tailwind classes in the HTML structure?

Do you have a specific element in the HTML that should use these classes?

Would you like an example of the completed HTML structure with the required Tailwind classes?

Awesome!

Completion rate improved to 3.57

bookUtfordring: Responsive Oppsett i Praksis

Sveip for å vise menyen

Oppgave

Fullfør den oppgitte HTML-strukturen ved å fylle inn de manglende Tailwind CSS-klassene i henhold til de angitte layoutkravene.

  • Containeren skal ha ulik polstring ved forskjellige breakpoints:
    • Standard polstring: p-4;
    • Ved sm breakpoint: p-6;
    • Ved md breakpoint: p-8;
    • Ved lg breakpoint: p-10;
    • Ved xl breakpoint: p-12.
  • Teksten skal ha ulike farger og størrelser ved forskjellige breakpoints.
    • Standard tekststørrelse: text-base, farge: text-gray-700;
    • Ved sm breakpoint: text-lg, farge: text-gray-600;
    • Ved md breakpoint: text-xl, farge: text-gray-500;
    • Ved lg breakpoint: text-2xl, farge: text-gray-400;
    • Ved xl breakpoint: text-3xl, farge: text-gray-300.
index.html

index.html

copy
  • For beholderen, bruk p-4 sm:p-6 md:p-8 lg:p-10 xl:p-12;
  • For teksten, bruk text-base sm:text-lg md:text-xl lg:text-2xl xl:text-3xl text-gray-700 sm:text-gray-600 md:text-gray-500 lg:text-gray-400 xl:text-gray-300.
index.html

index.html

copy

Alt var klart?

Hvordan kan vi forbedre det?

Takk for tilbakemeldingene dine!

Seksjon 5. Kapittel 2
some-alt