Hur skapar jag Bootstrap 5 Modal?

```

5. Inuti `modal-header`, lägg till modaltiteln med en `

`-element och en stängknapp med ett ``-element med klassen `btn-close`.

```html

Modaltitel

```

6. Lägg sedan till ett `

`-element med klassen `modal-body`. Detta element kommer att innehålla huvudinnehållet i modalen.

```html

```

7. Lägg till innehållet du vill visa inuti den modala kroppen. Detta kan innehålla text, bilder, formulär etc.

8. Lägg till ett `

`-element med klassen `modal-footer`. Detta element kommer att innehålla alla åtgärdsknappar, till exempel en skicka-knapp eller en stäng-knapp.

```html

```

9. Lägg till de åtgärdsknappar du vill ha i den modala sidfoten. Dessa knappar bör ha klassen 'btn' och lämplig Bootstrap-knappklass (t.ex. 'btn-primary', 'btn-secondary').

```html

Stäng

Spara ändringar

```

CSS:

Lägg till följande CSS-stilar till din stilmall:

``` css

.modal {

position:fast;

topp:0;

vänster:0;

z-index:1050;

display:ingen;

}

.modal.fade .modal-dialog {

övergång:omvandla 0,3s lättnad;

}

.modal.show .modal-dialog {

transform:translate(0, 0);

}

```

JavaScript:

För att visa modalen kan du använda JavaScript för att lägga till klassen `show` till elementet `.modal`. Här är ett exempel med jQuery:

```javascript

$('#exampleModal').modal('show');

```

För att dölja modalen, använd JavaScript för att ta bort klassen "show" från elementet ".modal".

```javascript

$('#exampleModal').modal('hide');

```

Det är det! Du har framgångsrikt skapat en Bootstrap 5-modal. Du kan ytterligare anpassa modalens utseende och beteende genom att lägga till ytterligare CSS och JavaScript.