bootstrap模态框远程示例代码分享


Posted in Javascript onMay 22, 2017

本文实例为大家分享了bootstrap模态框远程的具体代码,供大家参考,具体内容如下

<!DOCTYPE html> 
<html lang="zh-CN"> 
<head> 
 <meta charset="utf-8"> 
 <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
 <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"> 
 <title>XXX</title> 
 <link rel="stylesheet" href="lib/bootstrap/css/bootstrap.css"> 
 <link rel="stylesheet" href="css/main.css"> 
 <!--[if lt IE 9]> 
 <script src="lib/html5shiv/html5shiv.min.js"></script> 
 <script src="lib/respond/respond.min.js"></script> 
 <![endif]--> 
</head> 
<body> 
<!--通过按钮可以加载模态框内容,一定要加上头部和底部--> 
   <div class="modal-header"> 
    <!--关闭按钮--> 
    <button class="close" data-dismiss="modal"><!--可以关闭模态框--> 
     <span>×</span> 
    </button> 
    <!--头部标题--> 
    <h4 class="modal-title">远程登录</h4> 
   </div> 
   <div class="modal-body"> 
    <!--<p>暂时无法注册</p>--> 
    <div class="container-fluid"><!--在模态框主体部分还可以加入流体的栅格系统,一定是流体--> 
     <div class="row"> 
      <div class="col-lg-4 col-md-4 col-sm-6">haha</div> 
      <div class="col-lg-4 col-md-4 col-sm-6">hehe</div> 
      <div class="col-lg-4 col-md-4 col-sm-6">heihei</div> 
     </div> 
    </div> 
   </div> 
   <div class="modal-footer"> 
    <button class="btn btn-default">远程</button> 
    <button class="btn btn-primary">远程</button> 
   </div> 
<script src="lib/jquery/jquery.js"></script> 
<script src="lib/bootstrap/js/bootstrap.js"></script> 
<script src="js/main.js"></script> 
</body> 
 
</html>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
点击按钮自动加关注的代码(sina微博/QQ空间/人人网/腾讯微博)
Jan 02 Javascript
js+cookies实现悬浮购物车的方法
May 25 Javascript
浅谈Javascript数组的使用
Jul 29 Javascript
Javascript之Number对象介绍
Jun 07 Javascript
javascript实现随机生成DIV背景色
Jun 20 Javascript
es7学习教程之fetch解决异步嵌套问题的方法示例
Jul 21 Javascript
Django与Vue语法的冲突问题完美解决方法
Dec 14 Javascript
微信小程序实现购物页面左右联动
Feb 15 Javascript
js设置默认时间跨度过程详解
Jul 17 Javascript
vue实现跳转接口push 转场动画示例
Nov 01 Javascript
jQuery实现移动端笔触canvas电子签名
May 21 jQuery
vue-cli3 引入 font-awesome的操作
Aug 11 Javascript
bootstrap手风琴折叠示例代码分享
May 22 #Javascript
移动端手指放大缩小插件与js源码
May 22 #Javascript
jQuery滑动到底部加载下一页数据的实例代码
May 22 #jQuery
详解Angular路由 ng-route和ui-router的区别
May 22 #Javascript
Angular中$broadcast和$emit的使用方法详解
May 22 #Javascript
详解从angular-cli:1.0.0-beta.28.3升级到@angular/cli:1.0.0
May 22 #Javascript
详解AngularJS1.6版本中ui-router路由中/#!/的解决方法
May 22 #Javascript
You might like
PHP实现搜索地理位置及计算两点地理位置间距离的实例
2016/01/08 PHP
PHP利用超级全局变量$_GET来接收表单数据的实例
2016/11/05 PHP
BOOM vs RR BO5 第二场 2.14
2021/03/10 DOTA
jquery入门—访问DOM对象方法
2013/01/07 Javascript
js计算两个时间之间天数差的实例代码
2013/11/19 Javascript
js css 实现遮罩层覆盖其他页面元素附图
2014/09/22 Javascript
在JavaScript中操作数组之map()方法的使用
2015/06/09 Javascript
在JavaScript中处理时间之getHours()方法的使用
2015/06/10 Javascript
解决JS请求服务器gbk文件乱码的问题
2015/10/16 Javascript
js仿微博实现统计字符和本地存储功能
2015/12/22 Javascript
jQuery使用zTree插件实现树形菜单和异步加载
2016/02/25 Javascript
全面解析Bootstrap中tooltip、popover的使用方法
2016/06/13 Javascript
vuejs2.0运用原生js实现简单的拖拽元素功能示例
2017/02/24 Javascript
Javascript中从学习bind到实现bind的过程
2018/01/05 Javascript
使用ECharts实现状态区间图
2018/10/25 Javascript
小试小程序云开发(小结)
2019/06/06 Javascript
Vue + Elementui实现多标签页共存的方法
2019/06/12 Javascript
微信小程序实现传递多个参数与事件处理
2019/08/12 Javascript
vuex分模块后,实现获取state的值
2020/07/26 Javascript
python3实现抓取网页资源的 N 种方法
2017/05/02 Python
关于Python作用域自学总结
2019/06/10 Python
Python 虚拟空间的使用代码详解
2019/06/10 Python
关于PyTorch源码解读之torchvision.models
2019/08/17 Python
python函数超时自动退出的实操方法
2020/12/28 Python
美国维生素、补充剂、保健食品购物网站:Vitacost
2016/08/05 全球购物
网络安全方面的面试题
2016/01/07 面试题
毕业生实习鉴定
2013/12/11 职场文书
生产班组长岗位职责
2014/01/05 职场文书
物流专业求职计划书
2014/01/10 职场文书
初中政治教学反思
2014/01/17 职场文书
股份合作协议书范本
2014/04/14 职场文书
机械专业求职信
2014/05/25 职场文书
检讨书1000字
2014/10/11 职场文书
安全承诺书
2015/01/19 职场文书
2015年出纳年终工作总结
2015/05/14 职场文书
python实现简单的井字棋
2021/05/26 Python