bootstrap3 模态框（以后要坚持写博客）_bootstrap3模态框多行-CSDN博客

本文链接：https://blog.csdn.net/qq_14961511/article/details/46565919

本文介绍了如何利用Bootstrap3的data-*属性轻松创建模态框，无需JavaScript代码。通过data-target指定模态框目标，data-backdrop设置背景遮罩效果，包括true、false和static三种选项。此外，通过data-dismiss属性可以方便地关闭模态框。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

使用data-*属性，可以不使用任何JS代码生成模态框

例如：

<button class="btn btn-default btn-lg" data-backdrop="false" data-toggle="modal" data-target="#mymodal" >Bootstrap3按钮</button>
<div class="modal fade" id="mymodal">
    <div class="modal-dialog " >
        <div class="modal-content">
            <div class="modal-header">
                <button class="close" data-dismiss="modal">
                    <span>x</span>
                    <span class="sr-only">关闭</span>
                </button>
                <h4 class="modal-title">静态模态框</h4>
            </div>
            <div class="modal-body">
                <p>这里是模态框内容</p>
            </div>
            <div class="modal-footer">
                <button class="btn btn-default " data-dismiss="modal">关闭</button>
            </div>

        </div>
    </div>

</div>