Bootstrap 4教程-Bootstrap 4 Modal - 书目录

Bootstrap 4教程-Bootstrap 4 Modal

Display a Bootstrap-styled modal dialog box with a minimum of code.

Bootstrap enables you to add a modal dialog box to your site. A modal is a dialog box that takes the focus while the rest of the screen is dimmed or grayed out. This forces the user to take action on the dialog box before continuing.

To create a modal, use the .modal class along with various other .modal-* classes to define each section of the modal.




Modal Size

Modals have a default size of medium. You can specify small or large as required.

Small Modal

For a small modal dialog box, add the .modal-sm class to the .modal-dialog:

Due to the port-size for these examples, you might need to open this example in preview mode to see the proper effect.

Large Modal

For a large modal dialog box, add the .modal-lg class to the .modal-dialog:

Due to the port-size for these examples, you might need to open this example in preview mode to see the proper effect.

Remove Fade Effect

You can remove the .fade class to get rid of the fade-in/fade-out effect.

133621

 

英语原文:https://www.quackit.com/bootstrap/bootstrap_4/tutorial/bootstrap_modal.cfm 由工具自动翻译,由书目录整理