mirror of
https://github.com/twbs/bootstrap.git
synced 2025-01-07 00:46:15 +01:00
9f2aeafe85
Conflicts: Gruntfile.js dist/css/bootstrap-theme.css.map dist/css/bootstrap.css dist/css/bootstrap.css.map dist/css/bootstrap.min.css dist/fonts/glyphicons-halflings-regular.svg docs/_includes/components/badges.html docs/_includes/components/input-groups.html docs/_includes/components/pagination.html docs/_includes/css/forms.html docs/_includes/footer.html docs/_includes/getting-started/browser-device-support.html docs/_includes/getting-started/grunt.html docs/_includes/home-nav.html docs/_includes/js/alerts.html docs/_includes/js/buttons.html docs/_includes/js/carousel.html docs/_includes/js/collapse.html docs/_includes/js/modal.html docs/_includes/js/popovers.html docs/_includes/js/tooltips.html docs/_includes/nav/getting-started.html docs/_includes/nav/javascript.html docs/assets/css/docs.min.css docs/assets/css/src/docs.css docs/assets/js/customize.min.js docs/assets/js/raw-files.min.js docs/browser-bugs.html docs/dist/css/bootstrap-theme.css.map docs/dist/css/bootstrap.css docs/dist/css/bootstrap.css.map docs/dist/css/bootstrap.min.css docs/dist/fonts/glyphicons-halflings-regular.svg fonts/glyphicons-halflings-regular.svg less/_button-group.less less/_jumbotron.less less/_variables.less less/mixins/vendor-prefixes.less less/panels.less less/thumbnails.less package.json
14 KiB
14 KiB
layout | title |
---|---|
page | Modal |
Modals are streamlined, but flexible, dialog prompts with the minimum required functionality and smart defaults.
Overlapping modals not supported
Be sure not to open a modal while another is still visible. Showing more than one modal at a time requires custom code.
Modal markup placement
Always try to place a modal's HTML code in a top-level position in your document to avoid other components affecting the modal's appearance and/or functionality.
Mobile device caveats
There are some caveats regarding using modals on mobile devices. See our browser support docs for details.
Static example
A rendered modal with header, body, and set of actions in the footer.
Close
Modal title
One fine body…
Close
Save changes
{% highlight html %}
Close
Modal title
One fine body…
Close
Save changes
Live demo
Toggle a modal via JavaScript by clicking the button below. It will slide down and fade in from the top of the page.