展会信息港展会大全

bootstrap-modal使用方法
来源:互联网   发布日期:2016-03-25 16:12:25   浏览:2181次  

导读:本文章来给各位同学介绍关于bootstrap-modal使用方法,希望此方法对各位有所帮助。一般在两种html元素上调用,按钮和超链接。代码如下复制代码 <inpu...

本文章来给各位同学介绍关于bootstrap-modal使用方法,希望此方法对各位有所帮助。

一般在两种html元素上调用,按钮和超链接。

代码如下

复制代码

<input type="button" data-toggle="modal" data-target="#tree" class="btn" value="点我选择">

<a data-toggle="modal" href="#regulation">查看工号规则</a>

标准的modal层:

代码如下

复制代码

<div class="modal" id="myModal">

<div class="modal-header">

<a class="close" data-dismiss="modal">×</a>

<h3>对话框标题</h3>

</div>

<div class="modal-body">

<p>对话框内容</p>

</div>

<div class="modal-footer">

<a href="#" class="btn">关闭</a>

<a href="#" class="btn btn-primary">保存更新</a>

</div>

</div>

其中任何一块都可以去掉,关闭层,需要添加data-dismiss=”modal”,例如footer关闭按钮,添加这句,就生效了

赞助本站

人工智能实验室

相关热词: 开发 编程 android

AiLab云推荐
展开

热门栏目HotCates

Copyright © 2010-2024 AiLab Team. 人工智能实验室 版权所有    关于我们 | 联系我们 | 广告服务 | 公司动态 | 免责声明 | 隐私条款 | 工作机会 | 展会港