¿Cómo crear el modal Bootstrap 5?

```

5. Dentro del `modal-header`, agregue el título modal usando un ` elemento

` y un botón de cerrar usando un elemento `` con la clase `btn-close`.

```html

Título modal

```

6. A continuación, agregue un elemento `

` con la clase `modal-body`. Este elemento contendrá el contenido principal del modal.

```html

```

7. Agregue el contenido que desea mostrar dentro del cuerpo modal. Esto puede incluir texto, imágenes, formularios, etc.

8. Finalmente, agregue un elemento `

` con la clase `modal-footer`. Este elemento contendrá cualquier botón de acción, como un botón de enviar o un botón de cerrar.

```html

```

9. Agregue los botones de acción que desee dentro del pie de página modal. Estos botones deben tener la clase "btn" y la clase de botón Bootstrap adecuada (por ejemplo, "btn-primary", "btn-secundario").

```html

Cerrar

Guardar cambios

```

CSS:

Agregue los siguientes estilos CSS a su hoja de estilo:

```css

.modal {

posición:fija;

arriba:0;

izquierda:0;

índice z:1050;

pantalla:ninguna;

}

.modal.fade .modal-diálogo {

transición:transformación 0,3 s de salida gradual;

}

.modal.show .modal-diálogo {

transformar:traducir(0, 0);

}

```

JavaScript:

Para mostrar el modal, puede usar JavaScript para agregar la clase `show` al elemento `.modal`. Aquí hay un ejemplo usando jQuery:

```javascript

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

```

Para ocultar el modal, use JavaScript para eliminar la clase `show` del elemento `.modal`.

```javascript

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

```

¡Eso es todo! Ha creado con éxito un modal Bootstrap 5. Puede personalizar aún más la apariencia y el comportamiento del modal agregando CSS y JavaScript adicionales.