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 二分法(数组array)
Apr 24 Javascript
JS将表单导出成EXCEL的实例代码
Nov 11 Javascript
jQuery 过滤方法filter()选择具有特殊属性的元素
Jun 15 Javascript
jQuery实现的支持IE的html滑动条
Mar 16 Javascript
使用jQuery给input标签设置默认值
Jun 20 Javascript
JS实现的自动打字效果示例
Mar 10 Javascript
TypeScript入门-接口
Mar 30 Javascript
ES6中字符串string常用的新增方法小结
Nov 07 Javascript
从parcel.js打包出错到选择nvm的全部过程
Jan 23 Javascript
js实现简单的贪吃蛇游戏
Apr 23 Javascript
基于javascript实现日历功能原理及代码实例
May 07 Javascript
js实现验证码干扰(静态)
Feb 22 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递归返回值时出现的问题解决办法
2013/02/19 PHP
基于php-fpm的配置详解
2013/06/03 PHP
PHP错误Allowed memory size of 67108864 bytes exhausted的3种解决办法
2014/07/28 PHP
WebQQ最新登陆协议的用法
2014/12/22 PHP
ThinkPHP实现分页功能
2017/04/28 PHP
Thinkphp5结合layer弹窗定制操作结果页面
2017/07/07 PHP
JavaScript面向对象之静态与非静态类
2010/02/03 Javascript
使用JS 清空File控件的路径值
2013/07/08 Javascript
JS判断客服QQ号在线还是离线状态的方法
2015/01/13 Javascript
javascript实现点击提交按钮后显示loading的方法
2015/07/03 Javascript
JS+DIV+CSS实现的经典标签切换效果代码
2015/09/14 Javascript
jQuery AJAX timeout 超时问题详解
2016/06/21 Javascript
AngularJS 霸道的过滤器小结
2017/04/26 Javascript
webpack学习--webpack经典7分钟入门教程
2017/06/28 Javascript
Web技术实现移动监测的介绍
2017/09/18 Javascript
vue中实现在外部调用methods的方法(推荐)
2018/02/08 Javascript
微信小程序中this.data与this.setData的区别详解
2018/09/17 Javascript
VUE项目中加载已保存的笔记实例方法
2019/09/14 Javascript
python2.x实现人民币转大写人民币
2018/06/20 Python
解决tensorflow模型参数保存和加载的问题
2018/07/26 Python
tensorflow模型转ncnn的操作方式
2020/05/25 Python
MATCHESFASHION.COM美国官网:英国奢侈品零售商
2018/10/29 全球购物
Emma Bridgewater官网:英国餐具制造商
2019/11/24 全球购物
生产车间主管岗位职责
2013/12/28 职场文书
社区端午节活动方案
2014/01/28 职场文书
自我鉴定书
2014/03/24 职场文书
银行进社区活动总结
2014/07/07 职场文书
建筑学专业自荐书
2014/07/09 职场文书
环保志愿者活动方案
2014/08/14 职场文书
租车协议书范本2014
2014/11/17 职场文书
应届生求职自荐信范文
2015/03/04 职场文书
四风之害观后感
2015/06/09 职场文书
PHP实现rar解压读取扩展包小结
2021/06/03 PHP
Oracle11g R2 安装教程完整版
2021/06/04 Oracle
Vue3如何理解ref toRef和toRefs的区别
2022/02/18 Vue.js
mysql查找连续出现n次以上的数字
2022/05/11 MySQL