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 相关文章推荐
js获取当前select 元素值的代码
Apr 19 Javascript
js实现兼容IE6与IE7的DIV高度
May 13 Javascript
jQuery UI Datepicker length为空或不是对象错误的解决方法
Dec 19 Javascript
关于JS判断图片是否加载完成且获取图片宽度的方法
Apr 09 Javascript
javascript封装 Cookie 应用接口
Aug 07 Javascript
jQuery可见性过滤选择器用法示例
Sep 09 Javascript
浅谈javascript中执行环境(作用域)与作用域链
Dec 08 Javascript
ES6使用let命令更简单的实现块级作用域实例分析
Mar 31 Javascript
深入理解react-router@4.0 使用和源码解析
May 23 Javascript
Angular 4依赖注入学习教程之ValueProvider的使用(七)
Jun 04 Javascript
JS实现仿UC浏览器前进后退效果的实例代码
Jul 17 Javascript
在Vue中使用this.$store或者是$route一直报错的解决
Nov 08 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 mssql 时间格式问题
2009/01/13 PHP
PHP上传文件时文件过大$_FILES为空的解决方法
2013/11/26 PHP
ThinkPHP CURD方法之data方法详解
2014/06/18 PHP
为百度UE编辑器上传图片添加水印功能
2015/04/16 PHP
解析WordPress中函数钩子hook的作用及基本用法
2015/12/22 PHP
PHP使用Mysqli类库实现完美分页效果的方法
2016/04/07 PHP
joomla实现注册用户添加新字段的方法
2016/05/05 PHP
PHP中soap用法示例【SoapServer服务端与SoapClient客户端编写】
2018/12/25 PHP
php在linux环境中如何使用redis详解
2020/12/15 PHP
js加解密 脚本解密
2008/02/22 Javascript
javascript xml为数据源的下拉框控件
2009/07/07 Javascript
关于js拖拽上传 [一个拖拽上传修改头像的流程]
2011/07/13 Javascript
深入理解JavaScript系列(13) This? Yes,this!
2012/01/18 Javascript
jquery怎样实现ajax联动框(一)
2013/03/08 Javascript
JS+CSS实现带关闭按钮DIV弹出窗口的方法
2015/02/27 Javascript
jquery实现表单输入时提示文字滑动向上效果
2015/08/10 Javascript
浅析四种常见的Javascript声明循环变量的书写方式
2015/10/14 Javascript
每个程序员都需要学习 JavaScript 的7个理由小结
2016/09/03 Javascript
如何用JS/HTML将时间戳转换为“xx天前”的形式
2017/02/06 Javascript
Bootstrap免费字体和图标网站(值得收藏)
2017/03/16 Javascript
学习Vue组件实例
2018/04/28 Javascript
vue使用jsonp抓取qq音乐数据的方法
2018/06/21 Javascript
微信小程序实现带缩略图轮播效果
2018/11/04 Javascript
微信小程序中如何使用flyio封装网络请求
2019/07/03 Javascript
pandas.DataFrame的pivot()和unstack()实现行转列
2019/07/06 Python
pyinstaller参数介绍以及总结详解
2019/07/12 Python
关于pandas的离散化,面元划分详解
2019/11/22 Python
python pip安装包出现:Failed building wheel for xxx错误的解决
2019/12/25 Python
基于python实现检索标记敏感词并输出
2020/05/07 Python
IE下实现类似CSS3 text-shadow文字阴影的几种方法
2011/05/11 HTML / CSS
新西兰领先的内衣店:Bendon Lingerie新西兰
2018/07/11 全球购物
便利店投资创业计划书
2014/02/08 职场文书
学校领导班子成员查摆问题及整改措施
2014/10/28 职场文书
学校社团活动总结
2015/05/07 职场文书
初中历史教学反思
2016/02/19 职场文书
CSS浮动引起的高度塌陷问题
2022/08/05 HTML / CSS