Cambiar el color de backdrop (fondo oscuro) de la ventana modal de Bootstrap

Para cambiar el color que aparece cuando abrimos una ventana modal en Boostrap, buscamos el selector .modal-backdrop en nuestro archivo boostrap.css, y modificamos la propiedad background.

Para hacerlo más o menos opaco, unas lineas más abajo, tenemos .modal-backdrop.in, simplemente modificamos la propiedad opacity hasta que encontremos el efecto deseado.


Tu opinión es importante para mi, ¿Te ha resultado útil este artículo?

8 Comments

Astrix Borges Diaz

Hola! excelente tu aporte,

He creado un modal y el botón lo sustituí por un icono. El problema es cuando presiono el icono, aparece un borde y no se como quitarlo. Supongo que el borde es del antiguo botón. Si no se puede quitar, al menos cambiarlo de color para que se difumine con el fondo y no se vea.

Gracias

Reply
kike

¡Hola Astrix!

¿Puedes pasarme la URL o el código para que le pegue un ojo?

Gracias 🙂

Reply
CARLOS

Es confuso, una cosa es el «color de fondo de la ventana modal» y otro el color que aparece detrás en el «backdrop». Con lo que has dicho lo que haces es modificar lo segundo, pero no lo primero, por lo que no corresponde con el título

Reply
Paula

hola, sabes como quitarle el autoplay, he montado un video en un modal, pero cada vez que cargo la pagina se reproduce solo sin que habra el modal.. ya he buscado pero no encuentro por ningun lado, Gracias!. urge

Reply
kike

Hola Paula,

Gracias por escribir (:

Si es de un video con las etiquetas html5 puedes escribirle el atributo ‘preload=»none»‘.

Con lo que el video te quedaría algo así:


Espero que te sirva.

¡Saludos!

Reply

Responder a kike Cancelar la respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

*