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 相关文章推荐
基于jquery的放大镜效果
May 30 Javascript
javascript高级程序设计第二版第十二章事件要点总结(常用的跨浏览器检测方法)
Aug 22 Javascript
当某个文本框成为焦点时即清除文本框内容
Apr 28 Javascript
Javascript学习笔记之 对象篇(四) : for in 循环
Jun 24 Javascript
javascript里使用php代码实例
Dec 13 Javascript
js实现砖头在页面拖拉效果
Nov 20 Javascript
jQuery表单插件ajaxForm实例详解
Jan 17 Javascript
Angular.js基础学习之初始化
Mar 10 Javascript
详解Angular2响应式表单
Jun 14 Javascript
React数据传递之组件内部通信的方法
Dec 31 Javascript
从Vuex中取出数组赋值给新的数组,新数组push时报错的解决方法
Sep 18 Javascript
JavaScript中判断为整数的多种方式及保留两位小数的方法
Sep 09 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 Class 文章
2007/04/04 PHP
discuz7 phpMysql操作类
2009/06/21 PHP
PHP常用技巧总结(附函数代码)
2012/02/04 PHP
PHP常用开发函数解析之数组篇[未完结]
2012/07/30 PHP
php中使用exec,system等函数调用系统命令的方法(不建议使用,可导致安全问题)
2012/09/07 PHP
ThinkPHP5.1框架页面跳转及修改跳转页面模版示例
2019/05/06 PHP
javascript中的delete使用详解
2013/04/11 Javascript
jQuery中removeAttr()方法用法实例
2015/01/05 Javascript
JavaScript使用function定义对象并调用的方法
2015/03/23 Javascript
简介AngularJS的HTML DOM支持情况
2015/06/17 Javascript
AngularJS入门教程之AngularJS模型
2016/04/18 Javascript
jQuery防止重复绑定事件的解决方法
2016/05/14 Javascript
JS碰撞运动实现方法详解
2016/12/15 Javascript
angular实现IM聊天图片发送实例
2017/05/08 Javascript
vue实现表格增删改查效果的实例代码
2017/07/18 Javascript
详解webpack的配置文件entry与output
2017/08/21 Javascript
vue.js路由跳转详解
2017/08/28 Javascript
JavaScript中var的重要性实例分析
2019/07/09 Javascript
详解JavaScript 作用域
2020/07/14 Javascript
[02:20]DOTA2亚洲邀请赛 EHOME战队出场宣传片
2015/02/07 DOTA
Python使用pylab库实现画线功能的方法详解
2017/06/08 Python
Python使用回溯法子集树模板获取最长公共子序列(LCS)的方法
2017/09/08 Python
python数据预处理方式 :数据降维
2020/02/24 Python
matplotlib 生成的图像中无法显示中文字符的解决方法
2020/06/10 Python
python 基于卡方值分箱算法的实现示例
2020/07/17 Python
Html5写一个简单的俄罗斯方块小游戏
2019/12/03 HTML / CSS
信息技术专业大学生个人的自我评价
2013/10/05 职场文书
信息总监管理职责范本
2014/03/08 职场文书
安全责任书范本
2014/04/15 职场文书
劳动竞赛活动总结
2014/05/05 职场文书
个人欠款担保书
2014/05/20 职场文书
汽车销售经理岗位职责
2014/06/09 职场文书
小学音乐课歌曲《堆雪人》教学反思
2016/02/18 职场文书
python glom模块的使用简介
2021/04/13 Python
教你如何用python开发一款数字推盘小游戏
2021/04/14 Python
详解CSS故障艺术
2021/05/25 HTML / CSS