Modal

Add dialogs to your site for lightboxes, user notifications, or completely custom content.

Below is a static modal example (meaning its position and display have been overridden). Included are the modal header, modal body, and modal footer(optional). Include modal headers with dismiss actions whenever possible, or provide another explicit dismiss action.

Modal example

Modal Demo

Give Id to modal e.g (myModal).

Add data-target=modal & data-toggle attribute to the element which is going to open modal. Give Id of modal as a value to data-toggle attribute (e.g., data-toggle=#myModal).

To close the modal by clicking on element add data-dismiss=modal attribute to the element present inside modal.

Add backdrop to the modal with .modal-container class.