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 相关文章推荐
JavaScript仿淘宝页面图片滚动加载及刷新回顶部的方法解析
May 24 Javascript
把普通对象转换成json格式的对象的简单实例
Jul 04 Javascript
jQuery基于ajax实现页面加载后检查用户登录状态的方法
Feb 10 Javascript
vue如何引用其他组件(css和js)
Apr 13 Javascript
gulp安装以及打包合并的方法教程
Nov 19 Javascript
Node.js创建HTTP文件服务器的使用示例
May 11 Javascript
新手简单了解vue
May 29 Javascript
微信小程序实现点击效果
Jun 21 Javascript
layui实现数据分页功能(ajax异步)
Jul 27 Javascript
浅谈v-for 和 v-if 并用时筛选条件方法
Nov 07 Javascript
ES6中Promise的使用方法实例总结
Feb 18 Javascript
vuex中store存储store.commit和store.dispatch的用法
Jul 24 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 实现explort() 功能的详解
2013/06/20 PHP
php事务处理实例详解
2014/07/11 PHP
JSON 学习之JSON in JavaScript详细使用说明
2010/02/23 Javascript
javascript权威指南 学习笔记之null和undefined
2011/09/25 Javascript
使用Mootools动态添加Css样式表代码,兼容各浏览器
2011/12/12 Javascript
JavaScript实现在标题栏上显示当前日期的方法
2015/03/19 Javascript
JS使用面向对象技术实现的tab选项卡效果示例
2017/02/28 Javascript
jQuery返回定位插件详解
2017/05/15 jQuery
bootstrap Table的一些小操作
2017/11/01 Javascript
webpack+vue-cil中proxyTable处理跨域的方法
2018/07/20 Javascript
Nodejs使用Mongodb存储与提供后端CRD服务详解
2018/09/04 NodeJs
vue.js自定义组件directives的实例代码
2018/11/09 Javascript
layer.open提交子页面的form和layedit文本编辑内容的方法
2019/09/27 Javascript
JS使用for in有序获取对象数据
2020/05/19 Javascript
[01:30]DOTA2上海特锦赛现场采访 Loda倾情献唱
2016/03/25 DOTA
python统计cpu利用率的方法
2015/06/02 Python
Python多线程实现同步的四种方式
2017/05/02 Python
python pygame实现方向键控制小球
2019/05/17 Python
使用python实现多维数据降维操作
2020/02/24 Python
Python反爬虫伪装浏览器进行爬虫
2020/02/28 Python
关于keras.layers.Conv1D的kernel_size参数使用介绍
2020/05/22 Python
Django中的模型类设计及展示示例详解
2020/05/29 Python
Python操作Excel的学习笔记
2021/02/18 Python
手对手的教你用canvas画一个简单的海报的方法示例
2018/12/10 HTML / CSS
详解HTML5.2版本带来的修改
2020/05/06 HTML / CSS
会计专业毕业生自我评价
2013/09/25 职场文书
小饰品店的创业计划书范文
2013/12/28 职场文书
安全生产检查通报
2014/01/29 职场文书
优乐美广告词
2014/03/14 职场文书
《秋游》教学反思
2014/04/24 职场文书
品酒会策划方案
2014/05/26 职场文书
2015年环卫处个人工作总结
2015/07/27 职场文书
2015年新教师个人工作总结
2015/10/14 职场文书
前端vue+express实现文件的上传下载示例
2022/02/18 Vue.js
Python线程池与GIL全局锁实现抽奖小案例
2022/04/13 Python
排查Tomcat进程假死的问题
2022/05/06 Servers