模态框
Posted hamburger
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了模态框相关的知识,希望对你有一定的参考价值。
1 <head runat="server"> 2 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> 3 <title></title> 4 <link rel="stylesheet" href="bootstrap-3.3.5/dist/css/bootstrap.min.css" /> 5 <script src="bootstrap-3.3.5/js/tests/vendor/jquery.min.js"></script> 6 <script src="bootstrap-3.3.5/dist/js/bootstrap.min.js"></script> 7 </head> 8 <body> 9 <h2>创建模态框(Modal)</h2> 10 <!-- 按钮触发模态框 --> 11 <button class="btn btn-primary btn-lg" data-toggle="modal" 12 data-target="#myModal"> 13 开始演示模态框 14 </button> 15 <!-- 模态框(Modal) --> 16 <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> 17 <div class="modal-dialog"> 18 <div class="modal-content"> 19 <div class="modal-header"> 20 <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> 21 <h4 class="modal-title" id="myModalLabel"> 22 模态框(Modal)标题 23 </h4> 24 </div> 25 <div class="modal-body" runat="server"> 26 27 </div> 28 <div class="modal-footer"> 29 <button type="button" class="btn btn-default" 30 data-dismiss="modal">关闭 31 </button> 32 <button type="button" class="btn btn-primary"> 33 提交更改 34 </button> 35 </div> 36 </div><!-- /.modal-content --> 37 </div><!-- /.modal --> 38 </div> 39 40 </body> 41 </html>
以上是关于模态框的主要内容,如果未能解决你的问题,请参考以下文章