Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.Lære Udfordring og Quiz: Anvend Grundlæggende Bootstrap-Koncepter | Grundlæggende Koncepter
Bootstrap-Essentials til Moderne Websites

bookUdfordring og Quiz: Anvend Grundlæggende Bootstrap-Koncepter

Opgave: Forbedring af porteføljevisning med Bootstrap-klasser

  • Trin 1: Tilføj den relevante klasse til det angivne div-element for at oprette en global container.
  • Trin 2: Tilføj den relevante klasse til det angivne div-element for at oprette en række inden for containeren.
  • Trin 3: Tilføj de relevante klasser til de angivne div-elementer for at oprette kolonner til hvert porteføljeelement. Sørg for, at kolonnerne er responsive og justerer deres bredde tilsvarende. (Bemærk venligst, at der er tre div-elementer i dette trin).
  • Trin 4: Formater titlerne på porteføljeelementerne ved at tilføje relevante klasser til de angivne h2-elementer. Centrer titlerne inden for deres respektive kolonner.
  • Trin 5: Gør beskrivelserne af porteføljeelementerne læselige og passende i størrelsen ved at tilføje egnede klasser til de angivne p-elementer. Angiv skriftstørrelsen til fs-6.
index.html

index.html

index.css

index.css

copy

Udnyt Bootstraps grid-system (container, row, col) til at oprette et responsivt layout for porteføljevisningen. Anvend typografiklasser (text-center, h2, fs-6) for at formatere titler og beskrivelser af porteføljeelementerne passende.

index.html

index.html

index.css

index.css

copy

1. Hvor mange kolonner opdeler Bootstraps gitter-system siden i?

2. Hvilken klasse omslutter og centrerer indholdet i en container med fast bredde?

3. Hvilke klasser bruges til at oprette en horisontal gruppe af kolonner i gitter-systemet?

4. Hvad repræsenterer klasserne sm, md, lg og xl?

5. Hvilke klasser bruges til at style overskrifter med forskellige størrelser?

6. Hvilke klasser bruges til at justere textelementer?

7. Hvilken klasse bruges til at stable knapper lodret sammen?

8. Hvilken klasse anvendes på checkbox- og radioknap-inputs inden for en form-check container for at sikre ensartet styling?

9. Hvordan bidrager Bootstraps gitter-system til organiseringen af formularlayout?

question mark

Hvor mange kolonner opdeler Bootstraps gitter-system siden i?

Select the correct answer

question mark

Hvilken klasse omslutter og centrerer indholdet i en container med fast bredde?

Select the correct answer

question mark

Hvilke klasser bruges til at oprette en horisontal gruppe af kolonner i gitter-systemet?

Select the correct answer

question mark

Hvad repræsenterer klasserne sm, md, lg og xl?

Select the correct answer

question mark

Hvilke klasser bruges til at style overskrifter med forskellige størrelser?

Select the correct answer

question mark

Hvilke klasser bruges til at justere textelementer?

Select the correct answer

question mark

Hvilken klasse bruges til at stable knapper lodret sammen?

Select the correct answer

question mark

Hvilken klasse anvendes på checkbox- og radioknap-inputs inden for en form-check container for at sikre ensartet styling?

Select the correct answer

question mark

Hvordan bidrager Bootstraps gitter-system til organiseringen af formularlayout?

Select the correct answer

Var alt klart?

Hvordan kan vi forbedre det?

Tak for dine kommentarer!

Sektion 3. Kapitel 8

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:

What are the exact Bootstrap classes I should use for each step?

Can you show an example of how the HTML structure should look after applying these classes?

Can you explain how the Bootstrap grid system ensures responsiveness in this scenario?

Awesome!

Completion rate improved to 3.23

bookUdfordring og Quiz: Anvend Grundlæggende Bootstrap-Koncepter

Stryg for at vise menuen

Opgave: Forbedring af porteføljevisning med Bootstrap-klasser

  • Trin 1: Tilføj den relevante klasse til det angivne div-element for at oprette en global container.
  • Trin 2: Tilføj den relevante klasse til det angivne div-element for at oprette en række inden for containeren.
  • Trin 3: Tilføj de relevante klasser til de angivne div-elementer for at oprette kolonner til hvert porteføljeelement. Sørg for, at kolonnerne er responsive og justerer deres bredde tilsvarende. (Bemærk venligst, at der er tre div-elementer i dette trin).
  • Trin 4: Formater titlerne på porteføljeelementerne ved at tilføje relevante klasser til de angivne h2-elementer. Centrer titlerne inden for deres respektive kolonner.
  • Trin 5: Gør beskrivelserne af porteføljeelementerne læselige og passende i størrelsen ved at tilføje egnede klasser til de angivne p-elementer. Angiv skriftstørrelsen til fs-6.
index.html

index.html

index.css

index.css

copy

Udnyt Bootstraps grid-system (container, row, col) til at oprette et responsivt layout for porteføljevisningen. Anvend typografiklasser (text-center, h2, fs-6) for at formatere titler og beskrivelser af porteføljeelementerne passende.

index.html

index.html

index.css

index.css

copy

1. Hvor mange kolonner opdeler Bootstraps gitter-system siden i?

2. Hvilken klasse omslutter og centrerer indholdet i en container med fast bredde?

3. Hvilke klasser bruges til at oprette en horisontal gruppe af kolonner i gitter-systemet?

4. Hvad repræsenterer klasserne sm, md, lg og xl?

5. Hvilke klasser bruges til at style overskrifter med forskellige størrelser?

6. Hvilke klasser bruges til at justere textelementer?

7. Hvilken klasse bruges til at stable knapper lodret sammen?

8. Hvilken klasse anvendes på checkbox- og radioknap-inputs inden for en form-check container for at sikre ensartet styling?

9. Hvordan bidrager Bootstraps gitter-system til organiseringen af formularlayout?

question mark

Hvor mange kolonner opdeler Bootstraps gitter-system siden i?

Select the correct answer

question mark

Hvilken klasse omslutter og centrerer indholdet i en container med fast bredde?

Select the correct answer

question mark

Hvilke klasser bruges til at oprette en horisontal gruppe af kolonner i gitter-systemet?

Select the correct answer

question mark

Hvad repræsenterer klasserne sm, md, lg og xl?

Select the correct answer

question mark

Hvilke klasser bruges til at style overskrifter med forskellige størrelser?

Select the correct answer

question mark

Hvilke klasser bruges til at justere textelementer?

Select the correct answer

question mark

Hvilken klasse bruges til at stable knapper lodret sammen?

Select the correct answer

question mark

Hvilken klasse anvendes på checkbox- og radioknap-inputs inden for en form-check container for at sikre ensartet styling?

Select the correct answer

question mark

Hvordan bidrager Bootstraps gitter-system til organiseringen af formularlayout?

Select the correct answer

Var alt klart?

Hvordan kan vi forbedre det?

Tak for dine kommentarer!

Sektion 3. Kapitel 8
some-alt