--- title: Modals --- ## Modals Modals are popups for providing important information before continuing further. To create such dialogs/pop-ups on the top of current page Bootstrap provides Modal plugin. #### Code Example (Bootstrap v4.1) : ```html ``` #### Understanding the Attributes and classes used : a) `data-toggle = "modal"` : It opens up the modal. b) `data-target` : It points to the Id of the modal to open up. c) `data-dismiss="modal"` : This causes the popup to close when clicked on close button. d) `.modal` class identifies the contents of `
` as a modal. e) `.modal-dialog` class sets the proper height and width of the dialog. f) `.modal-content` class styles the modal.It contains header,body and footer sections. g) `.modal-header` class denotes the header section of the modal (title and (×) button). h) `.modal-title` class styles the header of the modal with a proper height. i) `.modal-body` class styles the body of the modal(dialog/popup).It can have other markups like `

,,