Saltar al contenido

ejemplo de código modal responsive bootstrap 4

Al fin luego de mucho luchar ya dimos con el resultado de esta aprieto que muchos usuarios de nuestro sitio web han tenido. Si quieres compartir algún detalle no dudes en compartir tu comentario.

Ejemplo 1: modal de arranque

<!-- Button trigger modal --><button type="button"class="btn btn-primary" data-toggle="modal" data-target="#exampleModalCenter">
  Launch demo modal
</button><!-- Modal --><div class="modal fade" id="exampleModalCenter" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true"><div class="modal-dialog modal-dialog-centered" role="document"><div class="modal-content"><div class="modal-header"><h5 class="modal-title" id="exampleModalCenterTitle">Modal title</h5><button type="button"class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button></div><div class="modal-body">...</div><div class="modal-footer"><button type="button"class="btn btn-secondary" data-dismiss="modal">Close</button><button type="button"class="btn btn-primary">Save changes</button></div></div></div></div>

Ejemplo 2: bootstrap 4 modal

<!-- Button trigger modal --><button type="button"class="btn btn-primary" data-toggle="modal" data-target="#exampleModal">
  Launch demo modal
</button><!-- Modal --><div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true"><div class="modal-dialog" role="document"><div class="modal-content"><div class="modal-header"><h5 class="modal-title" id="exampleModalLabel">Modal title</h5><button type="button"class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button></div><div class="modal-body">...</div><div class="modal-footer"><button type="button"class="btn btn-secondary" data-dismiss="modal">Close</button><button type="button"class="btn btn-primary">Save changes</button></div></div></div></div>

Ejemplo 3: modales bootstrap

<div class="modal" tabindex="-1" role="dialog"><div class="modal-dialog" role="document"><div class="modal-content"><div class="modal-header"><h5 class="modal-title">Modal title</h5><button type="button"class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button></div><div class="modal-body"><p>Modal body text goes here.</p></div><div class="modal-footer"><button type="button"class="btn btn-primary">Save changes</button><button type="button"class="btn btn-secondary" data-dismiss="modal">Close</button></div></div></div></div>

Ejemplo 4: modal en bootstrap 4

$('#myModal').modal('show')

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

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