Modals
Use Bootstrap’s JavaScript modal plugin to add dialogs to your site for lightboxes, user notifications, or completely custom content.
Modals are built with HTML, CSS, and JavaScript. They’re positioned over everything else in the document and remove scroll from the <body> so that modal content scrolls instead.
Default markup
To create a modal, you need to add a .modal element to the document. Inside the .modal, you need to add a .modal-dialog element, which contains a .modal-content element. The .modal-content element contains the modal’s header, body, and footer.
<div class="modal" tabindex="-1">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
...
</div>
<div class="modal-body">
...
</div>
<div class="modal-footer">
...
</div>
</div>
</div>
</div>
Look at the example below to see how the modal looks.
Prompt and alert
You can use the modal to create a prompt or alert. Look at the example below to see how the prompt and alert look.
Modal with form
You can use the modal to create a form. Look at the example below to see how the form looks.
