> Bemærk
>
> Alle udfordringer vil følge samme format som vist nedenfor:
> - Du vil blive præsenteret for opgaven, der skal løses;
> - Herefter vil du se et kodeblok, hvor du skal implementere ændringer baseret på opgaven;
> - Klik på **Kør kode**-knappen for at forhåndsvise den levende side;
> - Under kodeblokken finder du to knapper: **Tip** og **Løsning**;
>    - **Tip**-knappen giver vejledning til opgaven;
>    - **Løsning**-knappen viser den korrekte løsning.
> - Det anbefales, at du forsøger at løse opgaven selv, før du bruger **Løsning**-knappen.

## Opgave
Du har fået udleveret en grundlæggende HTML-kode med et `button`-element, der i øjeblikket er stylet med standard browser-stilarter. Selvom `button`-elementet indeholder klassenavne fra Bootstrap, er der ingen synlige ændringer på den levende side, fordi Bootstrap ikke er blevet integreret i projektet. Din opgave er at tilføje de relevante links for at forbinde Bootstrap til projektet.

PCFET0NUWVBFIGh0bWw+CjxodG1sIGxhbmc9ImVuIj4KICA8aGVhZD4KICAgIDxtZXRhIGNoYXJzZXQ9IlVURi04IiAvPgogICAgPG1ldGEgbmFtZT0idmlld3BvcnQiIGNvbnRlbnQ9IndpZHRoPWRldmljZS13aWR0aCwgaW5pdGlhbC1zY2FsZT0xLjAiIC8+CiAgICA8dGl0bGU+Q2hhbGxlbmdlIDE8L3RpdGxlPgogICAgPCEtLSBJbmNsdWRlIEJvb3RzdHJhcCBDU1MgbGluayBiZWxvdyAtLT4KCiAgPC9oZWFkPgogIDxib2R5PgogICAgPGJ1dHRvbiB0eXBlPSJidXR0b24iIGNsYXNzPSJidG4gYnRuLXN1Y2Nlc3MiPlN1Y2Nlc3M8L2J1dHRvbj4KICAgIDwhLS0gSW5jbHVkZSBCb290c3RyYXAgSmF2YVNjcmlwdCBsaW5rIGJlbG93IC0tPgogICAgCiAgPC9ib2R5Pgo8L2h0bWw+

- For at tilføje linket til Bootstrap CSS, brug følgende kode: `<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">`.
- Til Bootstrap JavaScript-linket, brug denne kode: `<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.min.js"></script>`.

PCFET0NUWVBFIGh0bWw+CjxodG1sIGxhbmc9ImVuIj4KICA8aGVhZD4KICAgIDxtZXRhIGNoYXJzZXQ9IlVURi04IiAvPgogICAgPG1ldGEgbmFtZT0idmlld3BvcnQiIGNvbnRlbnQ9IndpZHRoPWRldmljZS13aWR0aCwgaW5pdGlhbC1zY2FsZT0xLjAiIC8+CiAgICA8dGl0bGU+Q2hhbGxlbmdlIDE8L3RpdGxlPgogICAgPCEtLSBJbmNsdWRlIEJvb3RzdHJhcCBDU1MgbGluayBiZWxvdyAtLT4KICAgIDxsaW5rCiAgICAgIGhyZWY9Imh0dHBzOi8vY2RuLmpzZGVsaXZyLm5ldC9ucG0vYm9vdHN0cmFwQDUuMy4yL2Rpc3QvY3NzL2Jvb3RzdHJhcC5taW4uY3NzIgogICAgICByZWw9InN0eWxlc2hlZXQiCiAgICAvPgogIDwvaGVhZD4KICA8Ym9keT4KICAgIDxidXR0b24gdHlwZT0iYnV0dG9uIiBjbGFzcz0iYnRuIGJ0bi1zdWNjZXNzIj5TdWNjZXNzPC9idXR0b24+CiAgICA8IS0tIEluY2x1ZGUgQm9vdHN0cmFwIEphdmFTY3JpcHQgbGluayBiZWxvdyAtLT4KICAgIDxzY3JpcHQgc3JjPSJodHRwczovL2Nkbi5qc2RlbGl2ci5uZXQvbnBtL2Jvb3RzdHJhcEA1LjMuMi9kaXN0L2pzL2Jvb3RzdHJhcC5taW4uanMiPjwvc2NyaXB0PgogIDwvYm9keT4KPC9odG1sPg==

Hvad er en af metoderne til at integrere Bootstrap i et projekt?

Hvad står CDN for i forbindelse med Bootstrap-integration?

Hvilken kommando bruges til at installere Bootstrap via NPM?

Udforsk de grundlæggende principper i Bootstrap CSS-rammeværket og opdag hemmelighederne bag hurtigt og effektivt at skabe responsive og visuelt imponerende websites. Gennem praktisk udforskning af nøglefunktioner og implementering af kraftfulde komponenter opnås uvurderlig erfaring, der optimerer webudviklingsprocessen med Bootstraps alsidige værktøjssæt.

Udforsk essensen af Bootstrap og dets udvikling fra begyndelsen til i dag, vurder dets fordele og ulemper, og forstå forudsætningerne for effektiv implementering.

Gennemgå installationsmulighederne for Bootstrap. Vælg mellem hurtig integration via Content Delivery Network (CDN) eller en mere tilpasset tilgang med Node Package Manager (NPM).

Opnå færdigheder i centrale Bootstrap-elementer, herunder det alsidige gitter-system, nuanceret typografi, dynamisk brug af knapper, præcis håndtering af marginer og polstring samt udformning af effektive formularer for problemfri brugerinteraktion.

Forbedr dine Bootstrap-færdigheder med avancerede emner, der dækker dynamiske navigationsmenuer, responsiv billedhåndtering, alsidige kortlayouts, interaktive modaler og engagerende karuseller for fængende brugeroplevelser.

Opret et porteføljewebsite ved hjælp af Bootstrap-rammeværket med vores vejledning. Udnyt de avancerede funktioner i Bootstrap. Dette praktiske afsnit hjælper med at fremvise dine færdigheder, projekter og resultater.

Udfordring og Quiz: Opsætning af Bootstrap

Opgave

Quiz

1. Hvad er en af metoderne til at integrere Bootstrap i et projekt?

2. Hvad står CDN for i forbindelse med Bootstrap-integration?

3. Hvilken kommando bruges til at installere Bootstrap via NPM?